2011-06-30 7 views
14

コンテナdivに子要素が含まれているかどうかを確認するにはどうすればよいのだろうか。 div id = unreadまたはdiv id = readのいずれかの子に対して発生するクリックイベントがあります。私はこの子がどこにいるか確認したい。このような

何かが私は考えているされています

if ($("#unread").find($(this))) 
    alert("unread"); 
else 
    alert("read"); 

編集: $(この)は子孫#unreadまたは#READから二つのレベルです。

よろしく

+0

可能重複質問/ 648004/what-is-fast-children-or-find-in-jquery – Vivek

答えて

15

を利用する:.children()

if($("#unread").children().length > 0) 
    alert("unread"); 
else 
    alert("read"); 

EDIT

if($(event.target).closest('#unread').length > 0) 
    alert('unread'); 
else 
    alert('read'); 
+0

ああ、私は$(これ)は#unreadか#readの2つのレベルの子孫だと言って忘れてしまった。したがって親の親は未読または読み込みのいずれかでなければなりません – user822448

+0

クリックした$(this)は#unreadの2つのレベルであるため、これは機能しません。また、#unreadの2つのレベルの子供はいません。 – user822448

2

私はちょうど.lengthが動作するはずだと思う追加:

if ($("#unread").find($(this)).length > 0) 
    alert("unread"); 
else 
    alert("read"); 
+0

$(これ)のような複数の子があります。#unreadまたは#readの2つのレベルです。したがって、子供たちは$(これ)を特定しません。 – user822448

+0

これは質問に答えません。ある部門が子供を抱えているかどうかをチェックするのではなく、ある部門が別の部門の(巨大な)子であるかをチェックする方法を尋ねます。 – nnnnnn

+0

@ nnn-はい、**今**それは –

2

ゴーbackwa closestを使用して祖先として#unreadを探すために$(this)からRDS:

if($(this).closest('#unread').length > 0) 
    alert('unread'); 
else 
    alert('read'); 

あなたのHTMLの構造に応じて、これはthisを見つけるために、#unreadのすべての子を検索するよりも高速になります。おそらく速度の差はそれほど重要ではありませんが、逆方向に進むことの可能性とその可能性を認識しておく必要があります。

祖先を確認することは、あなたの意図にも適しています。thisが手元にあり、本当に知りたいのは「それは#unreadですか?」です。 closestを使用してバックアップすると、DOMツリーは求めている質問と正確に一致します。

あなたがしているいくつかの理由#unreadから始まるとその子孫をご覧の上、死者セットのために、あなたはfindを使用することができる場合:

if($('#unread').find(this)) 
    alert('unread'); 
else 
    alert('read'); 

しかし、あなたは、少なくともjQueryのを使用している場合、このアプローチは、のみ動作します1.6。

+0

そこに行く!これは目的のために働く。ありがとうございました! – user822448

2

使用.closest()または.parents()クリックした要素からツリーを検索する:

if ($(this).closest("#unread").length == 1) 
    // etc 

そうしないと、非jQueryの答えに興味がありますか?私は最善の方法では見ることができるか疑問

if (this.parentNode.parentNode.id === "unread") 
    alert("unread"); 
else 
    alert("read"); 

// or just alert(this.parentNode.parentNode.id); 
1

:あなたはクリックイベントとdiv要素は、あなただけのこの操作を行うことができ、正確に二つのレベル「読み取り」または「未読」のdivを下回っていると述べまし考えますコンテナdivに子要素が含まれている場合

特にパフォーマンスが問題になる場合は、$.contains()を使用してください。ドキュメントから:

jQueryブール

説明::DOM要素は、他のDOM要素の子孫であるかどうかを確認するためにチェック

戻り値を(含まれている、コンテナ)が含まれています。

他の人が推奨しているように、それは、.find().children()、または.closest()よりも効率的です。ただし、jQueryオブジェクトではなく、DOM要素のみをパラメータとして受け入れることに注意してください(パフォーマンスが優れている理由の一部です)。あなたのケースでは

、あなたのクリックイベントハンドラでこれを行うことができます:

if ($.contains($("#unread")[0], this)) { 
    alert("unread"); 
} else { 
    alert("read"); 
} 

EDIT:を再びこのことを考えれると、それがダウンするのではなく、クリックされた要素からアップ検索するおそらくより直感的です親要素から取得し、通常はクリックイベントハンドラではパフォーマンスが問題になることはありません。それは私のクリックイベントハンドラが含まれますので、私は、(@nnnnnnと@muによって示唆されているように短すぎる).closest()メソッドを使用することを選ぶだろう、次のとおりです。http://stackoverflow.com/の

if ($(this).closest("#unread").length > 0) { 
    alert("unread"); 
} else { 
    alert("read"); 
} 
関連する問題