jquery - jQueryToggleが最初に開かれました

Question

トグルのコンテナにクラスを追加して、ページの読み込み時に最初のトグルを開きたい。どうすればいいですか？

これは私のトグルのスクリプトです：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();
});

ご挨拶。

Answer 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/

Answer 2

拳セレクターを使用します。

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

フィドラー： http： //jsfiddle.net/cXhQN/

ただし、検索エンジンはJavaScriptを実行しないため、これはSEOでは機能しません。

Answer 3

このソリューションを使用できます。

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();異なるのは、最初のトグルコンテナを示す最後の行です。

Answer 4

$(".trigger:first").trigger("click");