我在加载页面时填充表格。我的行创建如下:
$.each(datax, function() {
$.each(this, function(kx , vx) {
tbl_row += '<td><p id="' +'^'+$key1+':'+$keyval1 +'^'+$key2+':'+$keyval2 +'^'+$key3+':'+$keyval3 +'^'+$key4+':'+$keyval4 +'^'+$key5+':'+$keyval5+ '$$'+kx+':'+vx+ '">'+vx+'</p></td>';
tbl_labels += "<th>"+kx+"</th>";
})
tbl_body += "<tr>"+tbl_row+"</tr>";
tbl_head = "<tr>"+tbl_labels+"</tr>";
})
$("#table_results thead").html(tbl_head);
$("#table_results tbody").html(tbl_body);
$("#table_results").table("refresh");
到目前为止工作正常。问题是,我想处理表格单元格的点击事件。我试图将span和p放在单元格中,但是后面的处理程序不起作用
$("p").click(function (){
alert('handler for click p worked');
});
$("span").click(function (){
alert('handler for click span worked');
});
我做错了什么?
答案 0 :(得分:4)
试试这段代码:
$(document).on('click', 'p', function (){
alert('handler for click p worked');
});
$(document).on('click', 'span', function (){
alert('handler for click span worked');
});
它正在使用on method来检测在dinamically创建的元素上的事件。
答案 1 :(得分:0)
您需要在此处使用事件委派,因为元素是动态添加的
$("#table_results").on('click', 'span', function(){
alert('handler for click span worked');
})
$("#table_results").on('click', 'p', function(){
alert('handler for click p worked');
})
答案 2 :(得分:0)
检查下面的代码(提醒单元格文本):
$("#tbl tbody").find("p").on("click",function (){
alert($(this).text());
});
答案 3 :(得分:-1)
绑定DOM准备好后创建的元素上的事件。您需要从DOM DOM准备好后生成的父DOM元素绑定它们。
所以你应该这样做:
$("#table_results tbody").find('span').click(function (){
alert('handler for click span worked');
});