bootstrap-table表格通过关键字查询并且条件筛选,表格中出现的关键字都标红

  • 获取表格行数

 $("#tableId").find("td").length;
  • 获取当前行的列数

 $("#exampleTable tr").each(function(rowIndex) { // 遍历表格行
		var colLength = $(this).find("td").length; // 获取当前行的列数
 }
  • 获取表格全列数

 $("#tableId").find("td").length;
  • 不多废话直接上代码

// 对整个表格进行模式匹配,可以用来模糊查询并标红所有关键字,
$("#exampleTable").on('post-body.bs.table', function() {

	var txtVal = $("#searchName").val();
	var reg = new RegExp(txtVal, 'ig'); // 'ig'忽略大小写,在全文中查找指定字符串
	
	if (txtVal != '' && txtVal != null) {
		$("#exampleTable tr").each(function(rowIndex) { // 遍历表格行
			var colLength = $(this).find("td").length; // 获取当前行的列数
			for (var i = 1; i < colLength; i++) {
				var txtObj = $(this).find("td").eq(i).text();
				var objColor = '<span style="color:red">' + txtVal + '</span>';
				var newObj = txtObj.replace(reg, objColor);
				$(this).find("td").eq(i).html(newObj);
			}
		});
	}
});
1. exampleTable:table 的id属性
2. ‘post-body.bs.table’ : 在表格体渲染完成,并在 DOM 中可见后触发
3. txtVal:需要标红的关键字
4. reg:该对象是一个正则表达式,对字符串执行模式匹配
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值