请问如何指定table中的某列能获得点击事件

leetow2006 2018-06-16 02:12:44
请看我的代码:
var t=document.getElementById("tab");
var rows=t.getElementsByTagName("tr");
for(var i in rows)
{
rows[i].onclick=rowclick;
}
这里的tab是table的id名称,tr是table中的列,
我的代码是table中所有的行,任一列都能获得点击事件,
现在我希望的是所有行中,只有第8列能获得点击
事件,请问该怎么做?
...全文
1906 9 打赏 收藏 转发到动态 举报
写回复
用AI写文章
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
leetow2006 2018-06-17
  • 打赏
  • 举报
回复
很感谢楼上网友的代码,复制你的程序可以运行,但是在我的程序中修改成你的代码,又不行了,不知道为什么 但是还是很感谢
天际的海浪 2018-06-16
  • 打赏
  • 举报
回复
引用 6 楼 leetow2006 的回复:
[quote=引用 4 楼 jslang 的回复:]

var t=document.getElementById("tab");
var rows=t.getElementsByTagName("tr");
for (var i = 0, len = rows.length; i < len; i++) {
	rows[i].getElementsByTagName("td")[7].onclick = rowclick; 
}
也不行,没有反应。另外:没有错误代码,我只是点击时,让框变红色。[/quote] 好吧,给你写个完整的代码

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title> 页面名称 </title>
<style>
td {
	border: 1px solid #999;
	width: 50px;
}
.sel {
	border: 1px solid #f00;
}
</style>
</head>
<body>
<table id="tab">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
		<td>4</td>
		<td>5</td>
		<td>6</td>
		<td>7</td>
		<td>8</td>
	</tr>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
		<td>4</td>
		<td>5</td>
		<td>6</td>
		<td>7</td>
		<td>8</td>
	</tr>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
		<td>4</td>
		<td>5</td>
		<td>6</td>
		<td>7</td>
		<td>8</td>
	</tr>
</table>
<script type="text/javascript">
function rowclick() {
	this.className="sel";
}

var t=document.getElementById("tab");
var rows=t.getElementsByTagName("tr");
for (var i = 0, len = rows.length; i < len; i++) {
	rows[i].getElementsByTagName("td")[7].onclick = rowclick; 
}
</script>
</body>
</html>
ambit_tsai-微信 2018-06-16
  • 打赏
  • 举报
回复
测试改变字体颜色,可以生效的。
leetow2006 2018-06-16
  • 打赏
  • 举报
回复
引用 4 楼 jslang 的回复:

var t=document.getElementById("tab");
var rows=t.getElementsByTagName("tr");
for (var i = 0, len = rows.length; i < len; i++) {
	rows[i].getElementsByTagName("td")[7].onclick = rowclick; 
}
也不行,没有反应。另外:没有错误代码,我只是点击时,让框变红色。
ambit_tsai-微信 2018-06-16
  • 打赏
  • 举报
回复
引用 3 楼 ambit_tsai 的回复:
我本地是可以的,不过我猛然惊觉,rows是一个数组,直接rows[7]就可以取到对应的元素了,尴尬

rows[7].onclick = rowclick; 
如果还不行,你把错误信息贴出来看看
汗颜,把第8列看出第8行了

t.querySelectorAll('td:nth-child(8)')  // 获取每个tr中的第8个td,也就是第8列
	.forEach(function(el){  // 遍历赋值
		el.onclick = rowclick;
	});
天际的海浪 2018-06-16
  • 打赏
  • 举报
回复

var t=document.getElementById("tab");
var rows=t.getElementsByTagName("tr");
for (var i = 0, len = rows.length; i < len; i++) {
	rows[i].getElementsByTagName("td")[7].onclick = rowclick; 
}
ambit_tsai-微信 2018-06-16
  • 打赏
  • 举报
回复
引用 2 楼 leetow2006 的回复:
[quote=引用 1 楼 ambit_tsai 的回复:]

var rows = t.getElementsByTagName('tr');
rows.item(7).onclick = rowclick;   // 第8行序号为7
我试了,不行呀,还有什么办法[/quote] 我本地是可以的,不过我猛然惊觉,rows是一个数组,直接rows[7]就可以取到对应的元素了,尴尬

rows[7].onclick = rowclick; 
如果还不行,你把错误信息贴出来看看
leetow2006 2018-06-16
  • 打赏
  • 举报
回复
引用 1 楼 ambit_tsai 的回复:

var rows = t.getElementsByTagName('tr');
rows.item(7).onclick = rowclick;   // 第8行序号为7
我试了,不行呀,还有什么办法
ambit_tsai-微信 2018-06-16
  • 打赏
  • 举报
回复

var rows = t.getElementsByTagName('tr');
rows.item(7).onclick = rowclick;   // 第8行序号为7

87,940

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧