JS操作HTML背景色

我就是个打字的 2012-09-25 05:14:44

<tbody class="tableBody" >
<tr class="odd" >
<td>
<input type="checkbox" name="patientIds" value="123"
onclick="changeBg(this);" /> </td>
<td>123</td>
<td>7</td>
<td>123</td>
<td width="120px" >2012-12-18</td>
<td>1231312.15</td>
<td>0月</td>
</tr>
</tbody>

我想要的效果是点击每一行的这个checkbox,通过这个函数changeBg,改变这一行TR的背景颜色,
真实数据有多行记录,无法确定多少行。
该怎么传参呢? this.parent?

...全文
321 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
  • 打赏
  • 举报
回复
[Quote=引用 6 楼 killer_zr 的回复:]

我是这样用的
1.给table 加上id 如:id="vaTab" ,复选框加上onclick="selectTR(this)"


2.js 如下var selectedTr = null;
function selectTR(obj){
var sTable = document.getElementById("vaTab")
for(var i = 1;i<s……
[/Quote]
哎哟,你晚了一步,刚刚结贴 不过还是谢啦
辛格瑞拉 2012-09-25
  • 打赏
  • 举报
回复
我是这样用的
1.给table 加上id 如:id="vaTab" ,复选框加上onclick="selectTR(this)"


2.js 如下var selectedTr = null;
function selectTR(obj){
var sTable = document.getElementById("vaTab")
for(var i = 1;i<sTable.rows.length; i++){
if(sTable.rows[i] != obj){
sTable.rows[i].style.removeAttribute("backgroundColor");
}else{
obj.style.backgroundColor='#DAE6FF';
selectedTr=obj;
}
}
}
  • 打赏
  • 举报
回复
thank you
[Quote=引用 4 楼 的回复:]

function changeBg(obj){
if(obj.checked){
obj.parentNode.parentNode.style.background = 'red';
}
else{
obj.parentNode.parentNode.style.background = 'none';
}
}
[/Quote]
hqyw20061215 2012-09-25
  • 打赏
  • 举报
回复
function changeBg(obj){
if(obj.checked){
obj.parentNode.parentNode.style.background = 'red';
}
else{
obj.parentNode.parentNode.style.background = 'none';
}
}
somedaywx 2012-09-25
  • 打赏
  • 举报
回复
var table=document.getElementById("table");
alert(table.rows.length);
}
  • 打赏
  • 举报
回复
怎么判断是否选中呢,选中变色,不选中清空颜色

[Quote=引用 1 楼 的回复:]

<table>
<tbody class="tableBody" >
<tr class="odd" >
<td>
<input type="checkbox" name="patientIds" value="123"
onclick="changeBg(this);" />
</td>
<td>123</td>
<td>7</td>
<td>123</td>
<td ……
[/Quote]
001007009 2012-09-25
  • 打赏
  • 举报
回复
<table>
<tbody class="tableBody" >
<tr class="odd" >
<td>
<input type="checkbox" name="patientIds" value="123"
onclick="changeBg(this);" />
</td>
<td>123</td>
<td>7</td>
<td>123</td>
<td width="120px" >2012-12-18</td>
<td>1231312.15</td>
<td>0月</td>
</tr>
</tbody>
</table>
<script>
function changeBg(t){
t.parentNode.parentNode.style.background = 'red';
}
</script>

87,991

社区成员

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

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