jquery Html table 页 实现点击选中tr行 改变背景颜色

Html table 页 实现点击选中tr行 改变背景颜色,我的情况是:

 table表格是使用jquery动态生成的,使用博主的代码没有用:如下:

$("#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 用于改变样式
});

我发现动态添加的,使用$().click()没有用,需要使用如下方式:

//点击td切换其他的背景颜色,2019年4月9日19:22:43  by qiulinhe		
			$(document).on('click', '#price_table_tick_close_trade  tr', function () {
				//alert("skdfjlskjdf");
                var trs = $(this).parent().find('tr'); //获取所有tr
 				if(trs.hasClass('button_background')){ //判断这些tr 有没有Class ‘on’’
				    trs.removeClass('button_background');//把class on 移除
				}
				$(this).addClass('button_background');//点击的tr 添加 on class 用于改变样式
            });

查了资料是因为:

1. //上面的.click()绑定点击事件 和 下面的 $(document).on("click",".pagination li:gt(0):not(:last)",function(){});的区别在于：

2. //.click只能为页面现有的元素绑定点击事件，如果是动态生成的新的元素，是没有事件的

3. //而$(document).on("click","指定的元素",function(){});方法则是将指定的事件绑定在document上，而新产生的元素如果符合指定的元素，那就触发此事件