jquery - 无法选择/jquery 来运行事件

Question

我正在尝试制作一个像这里这样的标签系统，但如果在数据库中找不到该标签，我希望能够允许用户提交它。

我正在使用选择的(here)和jquery。我已选择按照自己喜欢的方式工作，但无法运行 .click() 事件。有什么想法吗？

谢谢

<form>
<select multiple="multiple" id="jqtags" style="width:400px;height:30px !important;">
    <?php getTags(); ?>
</select>
<input type="submit" />
</form>

$(document).ready(function(){
    c.init.page();
});
$('form').submit( function() {
    var tags = $('#jqtags').val()
    return false;
});
$("#jqtags").chosen();

$('.no-results').click(function() {
    alert('123');
});

.no-results 由选择生成，并且在页面加载时不存在(如果有帮助的话)

Answer 1

.no-results is generated by chosen and isn't there on page load

这就是问题所在。因为当您尝试绑定(bind)事件时该元素不在 DOM 中，所以它不会被绑定(bind)。您可以将事件委托(delegate)给 DOM 树的更高层。 jQuery on method允许您通过传入选择器来完成此操作。

如果 .no-results 添加为 form 元素的后代，您可以执行以下操作:

$("form").on("click", ".no-results", function() {
    alert('123');
});

这是可行的，因为 DOM 事件倾向于从它们起源的元素向上冒泡。如果将事件处理程序绑定(bind)到祖先元素上，则当冒泡到达该元素时，它会被捕获。 on 方法检查源是否与选择器匹配，如果匹配则执行事件处理程序。