Question

我有div display:none，点击图标时会显示document.getElementById('icon').onclick = function(){ var el = document.getElementById('div'); if ( el.style.display != 'none' ){ el.style.display = 'none'; } else { el.style.display = 'block'; }; };。我的功能有效，但始终在 第二个 点击。任何想法功能有什么问题？

{{1}}

Answer 1

将测试更改为＆＃34;肯定＆＃34;

if ( el.style.display == 'block' ){

它会起作用。

默认值可能不完全是＆＃39;无＆＃39;。

使用jQuery可以更轻松，请参阅http://api.jquery.com/toggle/

Answer 2

el.style会引用inline样式，而不是global样式。

所以将代码更改为

<div id="nav_form_container" style="display:none">

并且代码可以正常工作。

http://jsfiddle.net/2hobbk7u/2/

Answer 3

这对我有用。我相信你可能在做的是使用div作为选择器而不是变量上的ID。

FIDDLE

HTML：

<button id="icon">Test Button</button>
<div id="test" style="display: none;">I am hidden</div>

<强> JS：

document.getElementById('icon').onclick = function(){
    var el = document.getElementById('test');
    if ( el.style.display != 'none' ){
        el.style.display = 'none';
    }
    else {
        el.style.display = 'block';
    };
};

切换显示仅在第二次点击时工作

3 个答案: