10

これを行う方法がわかりません。または、これができるかどうかもわかりません。jQuery UI アコーディオンがあります。各セクションには複数のアンカー タグが含まれており、それぞれに一意の文字列 ID があります。

特定のIDを持つ特定の要素がある場所にアコーディオンを開くことができるようにしたいと思います。id「item117」と言うように。次のようなものを使用できますか

$('#accordion').activate('activate','#item117');

あるいは

$('#accordion').activate('activate',117);

私はそれらといくつかのバリエーションを試しましたが、うまくいきません。私が仕事をしようとしていた場合、アコーディオンは 2 番目のセクションの最後まで開く必要がありました。


私はまだこれを取得していないので、他の何か間違ったことをしている可能性があります。ここに例のページを作りました: http://www.ofthejungle.com/testaccordion.php それとそのソースを見てください。

4

13 に答える 13

12

これも終わって、素敵で普遍的な解決策を見つけまし た
-必要なアイテムのヘッダーをクリックすることをそのIDでエミュレートします

$('#header-of-item-258').click(); 

アコーディオンだけでなく、いつでもどこでも機能します

于 2011-09-07T11:08:13.950 に答える
12

ドキュメントから:

// getter
var active = $( ".selector" ).accordion( "option", "active" );

// setter
$( ".selector" ).accordion( "option", "active", 2 );
于 2013-01-31T16:41:17.107 に答える
10

私のために働いた

$("#accordion").accordion({active:"h3:last"})
于 2011-06-12T11:25:02.703 に答える
9

これは最終的に私のために働いた:

$("#accordion").accordion("activate", $("#h3-id"));

ノート!!!id は、(デフォルトのアコーディオン設定で) 開きたい <h3> 要素の ID でなければなりません。

于 2011-03-21T19:06:36.970 に答える
9

と呼ばれる関数を使用して呼び出す必要がありますaccordion

// Open the third set (zero based index)
$('#accordion').accordion('activate', 2); 

特定の要素を含むセクションを開くには、次のようにします。注: 通常はセクションを開閉するトリガーをターゲットにする必要があります。ドキュメントでは、これはh3要素です。トリガー要素は異なる場合があるため、それに応じて変更してください。

$('#accordion').accordion('activate', '#accordion > div:has(#item117) > h3'); 
于 2009-12-14T07:04:13.027 に答える
3

#id でアコーディオンをアクティブ化する際にも同じ問題がありました。悲しいことに、これを行う方法が見つからなかったので、ハックを作成しました。div興味深いのインデックスを取得するために、アコーディオンの要素を反復処理しますdiv。次のようになります。

acc = 'tab-you-are-interested-in';

// find corresponding accordion
act = 0;
panels = $('#accordion-element > div');
for (i=0; i<panels.length; i++) {
    if ( panels[i].id == acc ) {
        act = i;  
    }
}

$('#accordion-element').accordion('activate', act);
于 2010-09-24T10:55:59.833 に答える
2

ヘッダーをクリックすると、それは h3 要素であり、次の div が開きます。これは機能です。ここで、 activate の場合、インデックスまたは要素を提供する必要があります。index は ID とは異なる場合があります。だから私は使用します:

$('.selector').accordion('option', 'activate', $(h3#id));

インデックスがあればそれを使用できます.しかし、ほとんどの場合、アコーディオンを動的に作成した場合、IDのインデックスを取得するのは簡単ではありません. このようなインデックスを見つけることができます..

 var processingHeaders = $('#accordion h3');
 for (i = 0; i < processingHeaders.length; i++) {

        ids.push($(processingHeaders[i]).attr('id'));
        idsForLaterChecks.push($(processingHeaders[i]).attr('id')); 
    }

今、私はIDを取得しました.. indexOfを使用して: 配列内のインデックスを見つけて使用します..

注: // idsForLaterChecks はグローバルです

于 2012-07-11T17:32:10.283 に答える
1

jQuery 1.9+ の場合:

$('#accordion').activate('activate', elementSelector);

今でしょ:

$('#accordion').activate('option', 'active', elementSelector);

トラバース メソッドを使用する方が簡単な場合、次のような HTML があるとします。

<div id="accordion">
    <h3><a href="#">Section</a></h3>
    <div>
        <p id="#item117" class="item">
            <a class="link-active" href="">Item 117</a>
        </p>            
    </div>
</div>

これを試して:

var myh3 = $('#item117').parent().prev('h3');
$('#accordion').accordion('option', 'active', myh3);
于 2013-06-04T19:34:22.840 に答える
0

次のようにアコーディオンを有効または無効にすることもできます。

// Add the class ui-state-disabled to the headers that you want disabled
$( ".whatyouwantdisabled" ).addClass("ui-state-disabled");

タブを再度有効にするには:

// Remove the class ui-state-disabled to the headers that you want to enable
$( ".whatyouwantenabled" ).removeClass("ui-state-disabled");
于 2011-07-29T23:34:20.180 に答える
0

試す

$('#accordion').activate('#item117');

また

$('#accordion').activate(document.getElementById('item117'));

アコーディオンを有効にするための正しい構文は次のとおりです。

$(".selector").activate(var index)

ここで、インデックスは文字列、要素、ブール値、数値、JQuery です

于 2009-12-14T07:03:36.060 に答える
0

ここに別の方法があります。

アコーディオンの H3 ヘッダー タグのそれぞれに ID="someId" を含め、ID に一意の名前を付けます。

たとえば、この ID は一連の「AccjA」になり、次の h4 は「AccjB」になります。

<h4 class="Accj" id="AccjA">
       <a href="#settings">A Fan?</a>
</h4>

次に、必要なパネルをアクティブにします。

    $('#Accjoin').accordion('activate', '#AccjoinA')

次のような Ben Alman の「.doTimeout」関数を使用して、ページが 2 秒の遅延で読み込まれた後、ユーザーの注意を引くためにタイムアウトで上記を使用しました。

$.doTimeout(2000, function () {
    $('#Accjoin').accordion('activate', '#AccjoinA')
});
于 2012-08-26T08:50:15.133 に答える
-1

jquery API とは

に含まれるアコーディオンの 2 番目のコンテンツをアクティブにします。

$(".selector").activate(1)

アコーディオンのすべてのコンテンツ パーツを閉じます。

$(".selector").activate(false)

指定された式に一致する最初の要素をアクティブにします。

$(".selector").activate("a:first")
于 2012-10-10T00:21:58.320 に答える