Javascript 为什么这个JS链接需要点击两下才能触发？

我正在编写一个脚本，该脚本将与我已经建立的网站一起使用。基本上，当您单击

Show/Hide按钮时，它会在内容
div
上显示一个覆盖。然后有一个选项可以隐藏整个
div
，包括覆盖、内容和容器

问题是，您必须单击
hide
链接两次，它才能隐藏所有div

我这里有一个工作示例：


编辑：我用正确的JS版本更新了JSFIDLE。我以前在那里有一个不完整的。

另外，允许cookie的脚本还有更多内容，我只是没有包含它以减少代码量。
这是因为style.display属性最初没有定义。颠倒逻辑可以解决这个问题。基本上是因为element.style.display直接读取元素的style属性，而不是像此元素中那样的javascript属性：

<div style="display:none;">blah</div>

将您的
toggle\u visibility（）
代码更改为此，让jQuery的
.toggle（）
和
.css（）
为您完成大部分工作：

<script>
    function toggle_visibility(a) {
        var item = $("#" + a);
        item.toggle();
        $.cookie("disp" + a, item.css("display"));
    }
</script>


功能切换_可见性（a）{
var项目=$（“#”+a）；
item.toggle（）；
$.cookie（“disp”+a，item.css（“display”）；
}

它不起作用的原因是原始代码中的
b.style.display
只返回内联样式。它不返回CSS规则设置的样式。如果您真的想获得这种风格，可以使用jQuery的
.css（“display”）
方法。但是，在这种情况下，您可以使用
.toggle（）
，让它为您完成所有工作。
我更新了我的问题。我忘了添加脚本处理cookies的部分。您的代码是否可以更新以使用cookie部分？除此之外，谢谢你解释为什么它不起作用。@Charlie不确定。看起来你的cookie语法是错误的：它不断抛出一个
没有方法“cookie”的错误。回到家后，我将不得不进一步研究它。@Joseph-$。cookie是一个jQuery插件，不是标准jQuery的一部分，因此您需要将该插件添加到项目中。脚本的其余部分在一个单独的文件中，我只是没有包含它，以便代码更小。cookie函数呢（很抱歉最近添加了这个部分，我在小提琴中的js代码是错误的）？我将cookie部分添加到了我的答案中。你只需在切换后获得结果显示值并将其设置到cookie中。我喜欢这个解决方案，因为它减少了代码量（并从我拥有的代码更新了代码）。至于cookie部分，效果很好。
<script>
    function toggle_visibility(a) {
        var item = $("#" + a);
        item.toggle();
        $.cookie("disp" + a, item.css("display"));
    }
</script>