jQuery .on点击第二次不工作

Question

var elms = $('.selector', list);
elms.off();
elms.on('vclick', function(event, ui) {
        event.preventDefault();
        var elm = $(this);
        customEventHandler(elm, elm.attr("id"));
});

如果我将click事件绑定$('.selector', list).on('click',...)到列表中的元素,它工作正常.

如果我.append()在列表中添加元素并再次调用,则$('.selector', list).on('click',...)不会触发任何单击.即使我.off()之前使用删除旧事件.

任何想法或建议？

Answer 1

试试这种方式: - Fiddle

$('.container').on('click', '.selector', function(event, ui) {
        event.preventDefault();
        var elm = $(this);
        alert(elm.index());
});

您可以使用此delegated events方法实现此目的.

委托事件的优点是,它们可以处理来自稍后添加到文档的后代元素的事件.通过选择在附加委托事件处理程序时保证存在的元素,您可以使用委派事件来避免频繁附加和删除事件处理程序的需要.例如,此元素可以是模型 - 视图 - 控制器设计中视图的容器元素,如果事件处理程序想要监视文档中的所有冒泡事件,则可以是文档.在加载任何其他HTML之前,文档元素在文档的头部可用,因此可以安全地将事件附加到那里而无需等待文档准备就绪.