1

我已经有一段时间了,我似乎无法理解如何解决它,我不知道我做错了什么。

我要做的是,当我点击网站上的链接时,它需要弹出一个计算器,然后当我点击该计算器上的关闭按钮时,它应该再次消失。我究竟做错了什么!?!?(注意:calcButton 是一个链接,buttonOff 是一个按钮)

function showCalc()
{
    alert("button was clicked");
    document.getElementById('calculator').style.visibility = "visible";
}

function hideCalc()
{
    alert("off button was clicked");
    document.getElementById('calculator').style.visibility = "hidden";
}

function main() {
    //store top and left values of calculator
    calculator.style.top = getStyle(calculator, "top");
    calculator.style.left = getStyle(calculator, "left");

    document.getElementById('calcButton').onclick = showCalc;
    document.getElementById('buttonOff').onclick = hideCalc;

}

window.onload = main;

编辑:

这是获取样式方法:

function getStyle(object,styleName)
{
    if (window.getComputedStyle)
    {
        return document.defaultView.getComputedStyle(object, null).getPropertyValue(styleName);
    }
    else if (object.currentStyle)
    {
        return object.currentStyle[styleName];
    }
}

编辑2:

Calc 按钮(这是一个 href)

<a href="" id= "calcButton">Calculator</a> 

另外,我认为有些人不明白问题所在。问题是当我点击它时,计算器变成可见然后几乎瞬间又隐藏起来

4

1 回答 1

1
<a href="" id= "calcButton">Calculator</a>

这将导致链接实际上重新加载您的页面,因此在您看来,计算器出现然后“立即隐藏”,因为页面已重新加载。

在属性中添加一些东西href

<a href="javascript:void();" id= "calcButton">Calculator</a>

现场演示

于 2013-02-22T04:19:51.623 回答