我在页面中使用以下
jquery.
var j = jQuery.noConflict();
j(document).ready(function(){
console.log(j("#label_19"));
j("#label_19").on("click",function(){
alert("Clicked");
});
});
加载文档时,控制台中会显示元素(它是一个复选框).但是当我单击该复选框时,不会抛出警报.但是当我复制相同的代码时(如下所示)
j("#label_19").on("click",function(){
alert("Clicked");
});
在控制台面板和按下运行.现在,当我单击复选框时,会抛出警报.在这种情况下可能是什么问题？
更新：
我在控制台中观察到的是：
Object[input#label_19.document_label attribute value = "Check-In"]
HTML标记是
<input id="label_19" class="document_label" type="checkBox" value="Check-In" name="label[19]">
解决方法
符合您所提供事实的唯一解释是,在您准备回调之后但在您单击替换相关元素的元素之前,代码会运行.某种ajax回调或类似的.
您需要查看代码以找到发生这种情况的地方.要查找的内容是对包含#label_19元素的元素的任何html调用,或者(如果有jQuery和非jQuery代码的混合)对innerHTML的赋值.
您可以使用事件委派来解决此问题,这可能是也可能不是最佳答案,具体取决于您的代码正在执行的操作.看起来像这样：
var j = jQuery.noConflict();
j(document).ready(function(){
console.log(j("#label_19"));
j(document).on("click","#label_19",function(){ // This is the changed line
alert("Clicked");
});
});
在那里,我们不是挂钩点击实际的元素,而是将它挂在文档上,然后让jQuery告诉我们通过匹配我们在冒泡时给出的选择器的元素的点击.这样,事物正在破坏并重新创建#label_19元素并不重要,因为我们没有在该元素上挂钩处理程序.我们在文件上挂钩处理程序,并在事件发生时检查它是否通过了与该选择器匹配的内容.
但我不会盲目地使用事件委托,我会发现该元素真正发生了什么.
