为什么这个jq事件响应代码不起作用?

时间:2017-03-23 19:13:13

标签: jquery html events

我尝试为最初加载的链接设置点击事件注册' class div以及用户稍后将在' linksPanelHdr'中添加的任何其他内容。 DIV。我已经研究了如何做到这一点的现有SO答案,但我必须遗漏一些基本的东西。

使用这个html:

<div class="linksPanelHdr">
    <div id="171" class="link">
        <span class="delButt">Delete Link</span>
        <span class="openButt">Open Link</span>    
    </div>
</div>

和这个jq:

$(".linksPanelHdr").on("click",".delButt",function(){ 
    alert("Triggered by link"+$(this).parent().attr('id'));
});

根据我的理解,这个jq应该在任何&#39; delButt&#39; class元素,它是任何“linkPanelHdr”&#39;的后代。单击dom中的class元素。但Firefox Inspector显示,该事件在初始加载时未注册,或者在动态添加的链接中未注册。当然,点击事件无法触发。

如果我将.delButt选择器替换为&#39; null&#39;当我点击&#39; linksPanelHdr&#39; DIV。谁能告诉我在哪里搞砸了?提前致谢。

1 个答案:

答案 0 :(得分:0)

在发帖之前,我做了一些阅读。 Esp我重读了SO:Event binding on dynamically created elements?

在那里我注意到了这个例子:

$(staticAncestors).on(eventName,dynamicChild,function(){});

我正在为第一个选择器使用非静态祖先。即我试图在可以动态添加的树的div上注册事件。我不知道jq会如何知道,但无论如何都解决了这个问题。

我现在看到主选择器应该是树的第一个元素,它包含特定的(动态)选择器目标。我相信你想要在树上放置第一个静态元素,以尽量减少冒泡时间 - 所以不要只是去身体&#39;这将永远是静态的。希望这可能为其他可能遇到我完全错过的相同情况的人节省一些时间。