2

その領域内の任意の場所をクリックすると、いくつかの機能を持つ要素オーバーレイがあります。

<div id="overlay">
    some html and some <a href="#">links</a>
</div>

ここで、その領域内のリンクをクリックした場合にのみ、何か他のことが起こることを望みます:

$('#overlay').click(function() {
if(clicked_element=="a") alert("clicked inside");
    else alert("you clicked a link");
});

どうすればこれを完了することができますか?

4

4 に答える 4

6

使用できますevent.target：

$('#overlay').click(function(e) { // <- note the parameter
   alert(e.target); // <- the target
});

あなたの例では、次のようになります。

$('#overlay').click(function(e) {
    if(e.target.nodeName == "A"){ 
        alert("clicked inside");
    }else{
         alert("you clicked a link");
    }
});

完全を期すために、ネイティブ JavaScript ソリューションを次に示します。

document.getElementById("#overlay").addEventListener("click",function(e){
    alert(e.target);
},false);

ターゲットに最も近い ものを見つけたい場合は、jQueryを使用できます<a>closest()

于 2013-06-26T17:07:32.453 に答える
1 
$('#overlay').on('click', 'a', function() {
   //'this' now refers to clicked link
});
于 2013-06-26T17:08:38.537 に答える
0

最初にeventオブジェクトを取得します。.click(function(e) {

次に、そのtargetプロパティ (e.target)は、クリックした要素になります。確実にリンクを取得するには、これを試してください:

var target = e.target;
while(target && target.nodeName != "A") target = target.parentNode;

これは、リンクに画像がある場合などに役立ちます。

于 2013-06-26T17:09:13.077 に答える