0

JQMを実行すると、次のように見えるHTMLがあります（簡略化）。

<div id="servicesList">
    <div id="servicesHeader">Services</div>
    <ul data-role="listview" class="ui-listview">
        <li id="Serv1" class="serviceLink">Service 1</li>
    </ul>
    <ul data-role="listview" class="ui-listview">
        <li id="Serv2" class="serviceLink">Service 2</li>
    </ul>
</div>

このコードは、別のスクリプトから動的に生成されます。

各サービスには、さらにいくつかのデータを動的に取り込むクリックイベントがアタッチされています。理想的には、クリックされた時点でサービスのインデックスを参照できるようにしたいと思います。これが私の現在のコードです：

$('.serviceLink').click(function() {
    var index = $(this).closest("ul").index();
    servAnimate(index);
});

明らかに、プルされたオブジェクトの配列にはservicesHeader divが含まれているため、これは機能しません。親ulの配列のみを取得するにはどうすればよいですか？基本的に、ユーザーがサービス1をクリックすると、返されるインデックスは1ではなく0である必要があります。現在、インデックス0はservicesHeaderdivを参照しています。

私もこれを試しました：

$(this).closest("ul").filter("ul").index();

どんな助けでもいただければ幸いです！

編集：HTMLが別の開発者からのスクリプトによって生成されていることを指定する必要がありました。それは変わるかもしれません、それは同じままかもしれません。私がこれまでに持っている唯一の保証は、ULが同じレベルにとどまり、クラスserviceLinkを持つことです。

繰り返しになりますが、他にどの兄弟要素が存在するかに関係なく、親ULのインデックスのみを取得するにはどうすればよいですか？

4

4 に答える 4

1

あなたの要件で何か見落としていない限り、これは法案に適合しますか?

$(function() {
    $('#servicesList .serviceLink').on('click', function() {
        alert($('.serviceLink').index(this));
    });
})​

Service 1 をクリックすると 0 が返され、Service 2 をクリックすると 1 が返されます。

更新: これは、メイン div "servicesList" 内の ".serviceLinks" のみを検索します

于 2012-05-08T20:02:23.443 に答える
1

自分の質問に答える敗者のように感じてください！

index() を単独で使用することに慣れすぎて、修飾子を追加できることを忘れていました。さらに、クリックされた要素から逆方向に作業してその位置を見つける必要があると想定していました (そしてすべての回答者に伝えました)。代わりに、変更されないことがわかっている要素 (コンテナー div ID と各リンクの直接の構造) に基づいて要素のリストを作成し、そこからクリックされた要素のインデックスを取得するだけでした。

$('.serviceLink').click(function() {
    var index = $('#servicesList ul[data-role="listview"] li.serviceLink').index(this);
    servAnimate(index);
});

これを解決するための皆さんの助けに感謝します。

于 2012-05-10T13:27:25.787 に答える
0

サービス リスト、つまり UL だけをラップする別の DIV を導入します。次に、.closest('div')この新しい div が見つかり、インデックスはその中のゼロから始まります。

編集：

これを試して：

$("#servicesList").on('click', 'ul', function() {
    var index = $(this).siblings("ul").andSelf().index(this);
    alert(index);
});

デモ

于 2012-05-08T20:01:32.830 に答える
0

問題がある場合:

$('.serviceLink').click(function() {
    var index = $(this).closest("ul").index() - 1;
    alert(index);
});​

http://jsfiddle.net/u4Hy4/を参照してください

于 2012-05-08T20:11:49.213 に答える