我正在制作一个页面,您可以在其中检查表格中的几行,然后导出它们。
这里是代码http://www.bootply.com/Hrll6yz0c1
向模态导出菜单添加行的代码效果很好,但删除模态内的行的代码不起作用。
删除代码
$('button#delB').click(function() {
$(this).parent().parent().remove();
});
对于这个生成的表
$('button#addB').click(function() {
var toAdd = $(this).parent().parent().find("#sub_id").html();
var toAdd2 = $(this).parent().parent().find("#val1").html();
var toAdd3 = $(this).parent().parent().find("#val2").html();
$('#tblGrid').append("<tr><td>"+toAdd+"</td><td>"+toAdd2+"</td><td>"+toAdd3+"</td><td><button type='button' class='btn btn-default glyphicon glyphicon glyphicon-remove' id='delB'></button></td></tr>");
});
我尝试使用相同的代码删除外部模态,并且它有效。
最佳答案
正如我所怀疑的,delB
元素是动态生成的。因此,当您尝试将单击事件处理程序绑定(bind)到它们时,它们并不存在。因此 on()
更适合您想要做的事情:
$(document).on('click','button#delB',function() {
$(this).parent().parent().remove();
});
注意:$(document)
很可能是调用 on()
的不必要范围,请根据您的上下文使其更加具体。
顺便说一句:听从 George 的建议,确保您的 ID 都是唯一的,否则您会遇到问题。
关于javascript - Bootstrap、jQuery 在模态中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27146258/