2

我正在使用 jquery 代码来检查所有复选框，我确实喜欢这样：

var JQ7=jQuery.noConflict();
JQ7(document).ready(function(){
JQ7("#chkAll").click(function(){
    JQ7(".chk").prop("checked",JQ7("#chkAll").prop("checked"))
}) 
});
...
<input type="checkbox" id="chkAll" />   
...
<input type="checkbox" class="chk" />

我把所有代码都放在了ajax页面中。在第一次加载时它工作正常，但在我刷新后，它对我不起作用。这是ajax代码：

 function showUser(str,pageno,type,sub)
 {
     if (str=="" || pageno=="" || type=="" || sub== "")
 {
     document.getElementById("txtHint").innerHTML="";
     return;
 }
 if (window.XMLHttpRequest)
 {// code for IE7+, Firefox, Chrome, Opera, Safari
     xmlhttp=new XMLHttpRequest();
 }
 else
 {// code for IE6, IE5
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 xmlhttp.onreadystatechange=function()
 {
     if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
         document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
 }

 xmlhttp.open("GET","<?php echo $view['router']->generate('listing') ?>?page="+pageno+"&genre="+str+"&cat="+type+"&subcat="+sub,true);
 xmlhttp.send();
 }
4

2 回答 2

5

如果您正在动态构建页面的某些部分，则需要使用 $(...).on() 附加事件处理程序，否则在替换元素时事件处理程序将丢失。或者，您也可以在修改页面的该部分时再次重新附加事件处理程序。

您需要使用第二个选择器参数附加您的事件处理程序，如下所示：

$("#parent").on("click", ".item-to-be-clicked", function () {
    ...
});

委托与非委托事件处理程序的示例：http: //jsfiddle.net/pj5EW/

于 2013-11-07T23:27:15.547 回答
5

捎带赖赖恩的回答：

由于当前已编码，您的点击处理程序将仅适用于 DOM 中已存在的元素。当您在 DOM 加载后动态生成这些元素时，您的点击处理程序将看不到它们。

您可以使用 jQueryon()来委托事件。这会将处理程序放在文档（而不是元素）上，并允许您选择在 DOM 加载后添加到页面的元素：

JQ7(document).on('click','#chkAll',function(){
  var is_checked=this.checked;
  JQ7(".chk").prop("checked",is_checked);
});
于 2013-11-07T23:42:58.817 回答