我有一个带有许多复选框的表,它是使用 Ajax 生成的:
$.ajax({
type: "GET",
url: "jsonDevisUtilisateur.php?ra=" + $('#ra').val(),
success: function(data) {
var table = "<table class='dvs'><tr><td>Numéro</td><td>Client</td><td>Site</td><td>Libellé</td><td>Statut</td><td></td></tr>"
for (var i = 0; i < data.length; i++) {
table += "<tr><td>" + data[i].numDevis + "</td>";
table += "<td>" + data[i].client + "</td>";
table += "<td>" + data[i].site + "</td>";
table += "<td>" + data[i].libelle + "</td>";
table += "<td>" + data[i].statut + "</td>";
table += "<td><input type='checkbox' class='box' value='" + data[i].id + "' name='box[]'></td></tr>"
}
table += "</table>";
document.getElementById('devis').innerHTML = table + "<br/><br/>";
}
});
这部分运作良好! 问题是当我尝试集成“全选”按钮时。
我的 Javascript:
$(document).ready(function() {
$("#selectall").on("change", function(e) {
$("input[type=checkbox]").prop("checked", $(this).prop("checked"));
});
});
当我全选复选框时:<input type='checkbox' id='selectall' name='selectall'>
与我的 HTML 同时创建,它可以工作。
但是如果我创建我的 <input type='checkbox' id='selectall' name='selectall'>
在我的带有 ajax 函数的表中,它不起作用,并且没有任何反应。
我很确定这是因为该事件在页面加载时设置为“selectall”,但它还不存在,并且稍后不会查找它。
解决方案是什么?感谢您的帮助
最佳答案
您可以按如下方式使用事件委托(delegate)
:
$('#devis').on("change", "#selectall", function(e) {
$("input[type=checkbox]").prop("checked", $(this).prop("checked"));
});
关于javascript - 当元素未直接加载时,事件不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30462027/