Question

我的代码使用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>

Answer 1

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

Answer 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; }

Answer 3

<div class="accordion" style="display:none;">
    <dt><h3>Menu</h3></dt>
    <dd>
    Menu Contents
    </dd>
</div>

或在你的CSS上

accordion{
    display:none;
}

如何在加载时隐藏元素？

3 个答案: