0

我想通过向切换的容器添加一个额外的类来在页面加载时打开第一个切换。我该怎么做？

这是我的切换脚本：http: //jsfiddle.net/gKAFT/

$(".toggle-container").hide();
$(".trigger").toggle(function(){
    $(this).addClass("active");
    }, function () {
    $(this).removeClass("active");
});
$(".trigger").click(function(){
    $(this).next(".toggle-container").slideToggle();
});

问候。

4

4 回答 4

1

您可以触发事件：

$(".trigger").click(function(){
    $(this).next(".toggle-container").slideToggle();
}).first().click();

http://jsfiddle.net/sAxC7/

请注意，该toggle方法已弃用，您可以toggleClass改用：

$(".trigger").click(function(){
    $(this).toggleClass('active').next(".toggle-container").slideToggle();
}).first().click();

http://jsfiddle.net/B3Luc/

于 2012-12-23T12:59:06.727 回答
1

使用拳头选择器：

$(".trigger:first").next(".toggle-container").slideToggle();

提琴手：http: //jsfiddle.net/cXhQN/

但是，这对 SEO 不起作用，因为搜索引擎不执行 JavaScript。

于 2012-12-23T12:59:19.143 回答
1

您可以使用此解决方案：

jQuery(document).ready(function($) {       

    $(".toggle-container").hide(); 
    $(".trigger").toggle(function(){
        $(this).addClass("active");
        }, function () {
        $(this).removeClass("active");
    });
    $(".trigger").click(function(){
        $(this).next(".toggle-container").slideToggle();
    });

    $('.toggle-container').first().show(); 
});
​

这是一个小提琴。不同的是最后一行$('.toggle-container').first().show();显示了第一个切换容器。

于 2012-12-23T13:00:17.357 回答
0 
$(".trigger:first").trigger("click");
于 2012-12-23T13:05:00.393 回答