1

別の UL にネストされている可能性がある、クリックされたリスト項目のインデックス番号を取得する必要があります。

コードは、ネストされた UL の場合を除いて正常に機能します。親と子の LI を同時にクリックしているため、2 つの結果が返されます。LI の代わりにアンカー タグを使用しようとすると、結果は -1 になります。これは、アンカーが LI 内にあるためです。

フィドル: http://jsfiddle.net/4Ww9C/

コード：

(function($) {
    var manifest = $('#manifest li');
    manifest.click(function(e){
        $(this).addClass("active");
        manifest.not(this).removeClass('active');
        var selected = $(".active");
        var pos = manifest.index(selected);
        alert (pos);
    });

 }) ( jQuery );

シーケンシャル ナビゲーションを作成するために階層をフラット化しようとしています (スライドショーとキーバインドはこのインデックス番号に関連付けられます)。したがって、私が望む数は、基本的に、リストがフラットな場合に LI に対して得られる数です。

ありがとう！

4

1 に答える 1

4

イベントはその親に伝播します。e.stopPropagation()親のクリックイベントにも移動しないように使用できます（複数のアラートが発生しています）。

manifest.click(function (e) {
        e.stopPropagation();

.....

試す：

(function ($) {
    var manifest = $('#manifest li');
    manifest.click(function (e) {
        var $this = $(this),
            pos;
        e.stopPropagation();
        manifest.find('.active').not($this.children('a').addClass("active")).removeClass('active');
        pos = manifest.index($this);
        alert(pos);
    });
})(jQuery);

デモ

また、アクティブに適用するliと、すべての子のスタイルもカバーされますが、代わりにアンカーにスタイルを適用できます。アンカーで幅全体をカバーする場合は、アンカーのスタイルを次のように指定します。display:block

li > a{
    display:block;
}

デモ

于 2013-11-04T20:32:37.770 に答える