table append 的数据无法进行click

原创于 2021-07-15 15:42:08 发布 · 176 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

js 专栏收录该内容

12 篇文章

订阅专栏

这段代码展示了如何使用jQuery为表格行绑定点击事件，实现选中和取消选中效果。当点击tr元素时，移除其他tr的'on'类，并将点击的tr添加'on'类，以改变其样式。

例子

$("#tbody tr").click(function(){ //给每个tr 绑定点击事件  主要锁定每个tr
	var trs = $(this).parent().find('tr'); //获取所有tr 
	if(trs.hasClass('on')){ //判断这些tr 有没有Class ‘on'’
		trs.removeClass('on');//把class on 移除 
	}             
	$(this).addClass('on');//点击的tr 添加 on class 用于改变样式
});

实现

 $(document).on("click", "#tbody tr", function () {
            var trs = $(this).parent().find('tr'); //获取所有tr
            if (trs.hasClass('on')) { //判断这些tr 有没有Class ‘on'’
                trs.removeClass('on');//把class on 移除
            }
            $(this).addClass('on');//点击的tr 添加 on class 用于改变样式
        });