子要素が選択されているかどうかをチェックするif/else文を書く方法は？

Question

は私のようないくつかの子孫/子供を持つdiv要素を持っている想像：

<div class="currenTile" tabindex="0"> 
    <h1 tabindex="0"> my Header </h1> 
    <p tabindex="0"> some text </p> 
    <ul tabindex="0"> 
    <li tabindex="0"> item 1 </li> 
    <li tabindex="0"> item 2 </li> 
    <li tabindex="0"> item 3 </li> 
    </ul> 
</div> 

要素がフォーカスを持ち、子であるならば、私は、KeyDownイベントイベント後にチェックし、「他/ IF」文を作成したいです'currentTile' divの、何かをするために。どのようにこれを行う上の任意のアイデア？

Answer 1

あなたが行うことで、これを確認することができます。

#myElementはチェックするどんな要素である

if($("#myElement").is(":focus") && $("#myElement").closest(".currenTile").length > 0) 

。 （ "：focus"）は、そのフォーカスされた明示的にclosest（）が、そのクラス名を持つ親要素を探すその要素からDOMを登るかどうかを調べます。

Answer 2

あなたの要素に「ユニコーン」のIDなどを与えます。

//Assuming you have keydown event check first 

if (document.activeElement.parent().getAttribute("id") == "unicorn") { 
//Do Stuff with document.activeElement 
} 
else { 
//Do Different Stuff with document.activeElement 
} 

コードによっては、親が何であるかを特定する良い方法があるかもしれません。

あなたはすべての子孫をチェックしたい場合：

$(document).on("keydown", function() { 
    var isChildOfDiv = $(":focus").parents("div.currenTile").length > 0; 
    console.log(isChildOfDiv); //true if element with focus is within the div, false otherwise 
}); 

JSFiddle：：これはトリック行う可能性があります

//Assuming you have keydown event check first 
var x = document.activeElement(); 
var found = false; 
while (x=x.parentElement) { 
    if (x.parent().getAttribute("id") == "unicorn") { 
     found = true; 
     break; 
    } 
} 
if (found) { 
    //Do Stuff with document.activeElement 
} 
else { 
    //Do Different Stuff with document.activeElement 
} 

Answer 3

https://jsfiddle.net/9rvyps8g/

$(":focus")中心とした現在の要素を取得し、その要素の親のすべてを.parents()でチェックし、di vのクラスです。

これは、そのクラスにdivが1つしかないため、これがそのまま動作することに注意してください。私は何も起こらないと仮定していますが、同じクラスの他のdivで何が起こるかはテストしていません。 1つのdivだけが必要な場合は、代わりにIDを使用します。