Question

品牌打击 - JavaScript的新手，并试图将其作为学校评估网站的一部分来实施。

我尝试做的是，使用多个按钮，更改div的显示样式。我遇到问题的部分是让我的函数保持打开状态（style.display = block）如果按下另一个按钮作为最后一个按钮，或者如果它是相同按钮则关闭（style.display = none）像前一样。

这背后的原因是下一步将实现一些AJAX，根据相同的按钮将不同的内容调用到div中。只是想先了解基础知识。（学习练习）

    function toggle_visibility(caller) {
    var e = document.getElementById('hidden');
    var current;
    if(caller == current){
        e.style.display = 'none';
        current = 'none';
    }else{
        e.style.display = 'block';
        current = caller;
    }

这就是我的脚本，按钮本身就是用不同的来电者调用上面的脚本＆＃39;：

<button onClick="toggle_visibility('Button1')">Button1</button>
<button onClick="toggle_visibility('Button2')">Button2</button>
<button onClick="toggle_visibility('Button3')">Button3</button>

我做错了什么或错过了什么？感谢。

Answer 1

问题是current仅在该函数的生命周期内存在。您需要保存在函数外部的变量中单击的最后一个按钮（在全局范围内）。只需将行var current;移到函数定义之外，就可以了。

Answer 2

变量＆＃34; current＆＃34;范围限定为toggle_visibility函数。每次单击按钮并调用该函数时，＆＃34; current＆＃34;变量被重新创建。

您需要移动＆＃34; var current;＆＃34;在函数toggle_visibility之外。

当您准备就绪时，请阅读此内容以获取详细信息： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope

Answer 3

删除声明 var current; 它会起作用。在这种情况下，您正在创建局部变量current。如果您不使用'var'关键字，它将被创建为全局，并将解决您的问题。 http://jsfiddle.net/WG9y9/

根据当前显示，显示/隐藏div的多个按钮

3 个答案: