2

我的代码使用 jQuery 启用手风琴。
当我单击accordion dt元素时，手风琴打开，如果我再次单击它会关闭。

默认情况下，它已打开，但在整个页面加载后关闭。
这看起来很奇怪，所以我想将其隐藏为默认值。
可能吗？

Javascript

jQuery(document).ready( function() {
    $(".accordion dt").click(function(){
        $(this).next("dd").slideToggle();
        $(this).next("dd").siblings("dd").slideUp();
        $(this).toggleClass("open");   
        $(this).siblings("dt").removeClass("open");
    });
});

window.onload = function(){     
        $(".accordion dd").hide();
}

HTML

<div class="accordion">
    <dt><h3>Menu</h3></dt>
    <dd>
    Menu Contents
    </dd>
</div>
4

3 回答 3

2

正确设置初始元素样式，使其以正确的状态开始呈现。

于 2013-08-04T05:30:06.367 回答
2

为什么不将hide()函数放在首页加载处理程序中？

jQuery(document).ready( function() {
    $(".accordion dd").hide();

    $(".accordion dt").click(function(){
        $(this).next("dd").slideToggle();
        $(this).next("dd").siblings("dd").slideUp();
        $(this).toggleClass("open");   
        $(this).siblings("dt").removeClass("open");
    });
});

无论如何，我建议您将其作为 CSS 规则：

.accordion dd { display: none; }
于 2013-08-04T05:32:52.753 回答
1 
<div class="accordion" style="display:none;">
    <dt><h3>Menu</h3></dt>
    <dd>
    Menu Contents
    </dd>
</div>

或在您的 CSS 上

accordion{
    display:none;
}
于 2013-08-04T05:32:34.323 回答