我有一个在容器文档上触发的事件处理程序,将其传播到自身内部的 li-Element。出于某种原因,当我按下回车键时,该事件也会触发一个链接,该链接位于 DOM 树的更上方。我无法阻止事件使 DOM 冒泡,我不知道为什么。任何人都可以帮忙吗?谢谢。
我正在使用 jQuery 1.7,不幸的是,由于它的复杂性,我无法给出任何有意义的实时代码示例...... :-(
我的 HTML 是这样的:
<div id="contentBox">
<form [...]>
<a class="del" href="javascript:[...]">Delete entry</a>
<fieldset>
<legend>An entry</legend>
<input name="xy" class="lmti">
<ul>
<li>Result 1</li>
<li>Result 2</li>
<li>Result ...</li>
</ul>
</fieldset>
</form>
</div>
我的 Javascript 片段如下所示:
$('#contentBox').on('click', '.del', function(e) { [...deletes an entry...] });
和
$('#contentBox').on('keyup', '.lmti', function (e) { [...takes over search results...] });
会发生什么:
#contentBox的内容是使用 ajax 动态加载的。我有一个元素列表,可以动态扩展。每次我添加一个新元素时,都会添加一组字段集中的所有标签。我可以使用旁边的链接class="del"删除一个元素。当用户在输入框中输入内容时,我会在其下方显示一个实时搜索框,以便他可以从那里接管条目。这也可以通过按向下箭头,浏览搜索结果,然后按回车来接管结果。
在上述事件中,我检查按下的返回,实际上我从标题列表中获取一个标题并将其放入 HTML 输入字段中。就像谷歌实时搜索一样。
问题:如果我按回车键接管结果集,则上述事件也会为删除链接的单击事件处理程序触发。
我无法使用e.stopPropagation、e.stopImmediatePropagation、e.preventDefault()等的任何组合来停止传播。
我只发现检查删除链接事件处理程序中的事件目标会阻止条目被删除。但我更希望事件不要到达a -click 事件。
%-/
有任何想法吗?