-1

こんにちは、次の HTML コードがあります

<div id='parentDiv'>
    <div class='firstDiv'>
         <div class='firstDivChild1'></div>
         <div class='firstDivChild2'>
              <div class='firstDivChild2_Child1'></div>
              <div class='firstDivChild2_Child2'></div>
         </div>
    </div>
    <div class='secondDiv'>
         <div class='secondDivChild1'>
              <div class='secondDivChild1_child'>
                   <div class='secondDivChild1_child_child'></div>
              </div>
         </div>
    </div>
</div>

今、私の要件は、任意の div をクリックしたときに、最上位の親 ID (つまり、parentDiv) を取得することです。現在、以下のスクリプトを使用して親 ID を取得しています。

<script type='text/javascript'>
$('div').click(function(e){
   var parentDivId = (e.target).parentNode.id;
   alert(parentDivId );
});
</script>

しかし、うまくいきません。私の要件を満たすために誰でもこのコードを修正できますか? 前もって感謝します。

4

5 に答える 5

2

その親 DIV がドキュメント全体で一意である場合は、ID、つまり $('#parentDiv') で参照できますが、そうでない場合は、HTML を変更して、parentDiv にいくつかのクラス (つまり、parentDiv) を追加する必要があります。 $(this).parents('.parentDiv:first'); という式で参照できます。

于 2012-04-19T10:45:26.983 に答える
1
$('div').click(function() {
    alert($(this).parents('div').last().attr('id'));
    return false;
});​

ライブデモ

于 2012-04-19T10:51:24.197 に答える
1

次に、イベント バブリングの自然な力を使用します。クリックされた子孫は、イベントを上にバブルアップし (バブル)、親がクリックされたかのように動作します。そのため、親にクリック ハンドラーを追加しても同じことが行われます。

$('#parentDiv').on('click',function(){
    var id = this.id
});
于 2012-04-19T05:18:10.463 に答える
1

この小さな機能を試してください:

$.fn.root = function() {
  var $all = $( this[0] ).parents(); 

  // omit "html", "body" and one index to the last item;
  return $all.slice( $all.length - 3, $all.length - 2 );
};

サンプル使用法:

$('input').click(function() {
    alert($(this).root().prop('id'));
});​

ここで HTML を使用した簡単な作業例

于 2012-04-19T11:05:32.293 に答える
0

あなたが何を求めているのかはまだ完全には明らかではありませんが、あなたのコメントのいくつかに基づいて、これが私の最善の推測です.

イベント バブリングを使用すると、ドキュメント内のすべてのクリックを調べて、クリックが発生した場所を特定し、そのクリックがe.targetdiv ツリーで発生したのか、他の場所で発生したのかを判断できます。

$(document).click(function(e) {
    // determine if click was in our div tree or not
    if ($(event.target).closest("#parentDiv").length) {
        // click was in our parentDiv tree
    } else {
        // click was not in our parentDiv tree
    }
});

クリックがどこにあるかに関係なく、次のid="parentDiv"jQuery を使用すると、いつでもdiv ツリーのトップを取得できます。

$("#parentDiv")

クリックされたものの上にある一番上の div だけが必要な場合は、クリックがドキュメント内のどこにあるかに関係なく、次のようなイベント バブリングを使用してそれを取得できます。

$(document).click(function(e) {
    e.stopPropagation();
    var topMostDiv = $(e.target).parents("div").last();
    // do whatever you want with topMostDiv here
});
于 2012-04-19T10:49:16.000 に答える