1

我为我的网站标题制作了一个隐藏/显示按钮，但我有这个“问题”。如果用户第一次加载我的网站，或者刷新后，这个按钮需要点击两次才能工作。但只是第一次。然后就可以正常使用了！知道为什么会这样吗？

下面评论中的实时示例。先感谢您！！！

4

4 回答 4

3

js代码是：

function display_news(){
var sheader_1 = document.getElementById("sheader_a");
var sheader_2 = document.getElementById("sheader_b");
if (sheader_1.style.display == 'block')
     sheader_1.style.display  = 'none', 
     sheader_2.style.display  = 'block';
else  sheader_1.style.display  = 'block', 
     sheader_2.style.display  = 'none';
     ;}

如果您在第一次加载页面时提醒 sheader_1 的值，结果是一个空字符串，因此您的代码不会做任何事情（它将跳转到 else 语句）。

使其工作的一种方法是：

function display_news(){
var sheader_1 = document.getElementById("sheader_a");
var sheader_2 = document.getElementById("sheader_b");
//here we also check if display property is empty
if (sheader_1.style.display == 'block' || sheader_1.style.display == '') 
     sheader_1.style.display  = 'none', 
     sheader_2.style.display  = 'block';
else  sheader_1.style.display  = 'block', 
     sheader_2.style.display  = 'none';
     ;}
于 2013-01-07T09:16:20.710 回答
2 
 function display_header(){
 var sheader_1 = document.getElementById("sheader_a");
 var sheader_2 = document.getElementById("sheader_b");

   if (sheader_1.style.display == 'block' || sheader_1.style.display=='')
      {
         sheader_1.style.display  = 'none';
           sheader_2.style.display  = 'block';
      }
   else  {
     sheader_1.style.display  = 'block'; 
     sheader_2.style.display  = 'none';
        }
     }

工作小提琴演示

于 2013-01-07T09:21:41.053 回答
1 
window.getComputedStyle(sheader_1).display

您需要获取元素的计算样式。否则此条件if (sheader_1.style.display == 'block')将不起作用，因为显示将为空。

在 Internet Explorer 中，计算样式的方法是：element.currentStyle.

我建议在这种情况下使用 jQuery。

于 2013-01-07T09:16:02.457 回答
1

当页面加载时，sheader_1 的显示不是块，而是一个空字符串。

因此，您可以将您的条件更改为：

if (sheader_1.style.display != 'none')
于 2013-01-07T09:17:48.160 回答