Jquery中使用某个关键字进行查询时，table里面相关文字颜色变化
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Table word Color Change</title>
<script language="javascript" type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var i = 0;
//在文本框中输入文字时，按下Enter键
$("#txtc1").keydown(function(e) {
var curKey = e.which;
//如果curKey等13时，说明是Enter键
if (curKey == 13) {
var txtQuery = $("#txtc1").val();
if (i >= 1) {
var Qt = txtQuery;
txtQuery = Qt;
$("#TT").load();
}
//判断是否为空
if (txtQuery == "") {
alert("不能为空，请输入");
return;
}
else {
//全文查找出现的所有txtQuery
var reg = new RegExp(txtQuery,'g');
//循环遍历整个table中td
$("td").each(function() {
//获取整个table内容
var bb = $(this).html();
//匹配整个
var cc = bb.replace(reg, '<span style="color:#F00">' + txtQuery + '</span>');
$(this).html(cc);
});
i++;
}
}
});
});
</script>
<style type="text/css">
.style1
{
height: 23px;
}
.style2
{
height: 25px;
}
body
{
margin: 0;
padding: 40px;
background: #fff;
font: 80% Arial, Helvetica, sans-serif;
color: #555;
line-height: 180%;
}
</style>
</head>
<body>
<input type="text" id="txtc1" />
<table width="100%" class="get1" style="border-color: Blue; border-style: groove" id="TT">
<tr>
<td class="style2">
1
</td>
<td class="style2">
2
</td>
<td class="style2">
3
</td>
</tr>
<tr>
<td class="style1">
3
</td>
<td class="style1">
3
</td>
<td class="style1">
4
</td>
</tr>
</table>
</body>
</html> 相关推荐
momode 2020-09-11
世樹 2020-11-11
SCNUHB 2020-11-10
bleach00 2020-11-10
FellowYourHeart 2020-10-05
思君夜未眠 2020-09-04
jessieHJ 2020-08-19
行吟阁 2020-08-09
表格的现在还是较为常用的一种标签，但不是用来布局，常见处理、显示表格式数据。在HTML网页中，要想创建表格，就需要使用表格相关的标签。<table> <tr> <td>单元格内的文字</td> ...
gufudhn 2020-08-09
末点 2020-08-03
nimeijian 2020-07-30
好记忆也需烂 2020-07-28
zlsdmx 2020-07-05
tomson 2020-07-05
tianqi 2020-07-05
onlykg 2020-07-04