资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
Js获取table当前tr行的值的代码
下面的代码主要是学习控制表格里面的一些操作，代码都是直接写在表格里面的， 大家可以改成事件绑定的。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Js获取 table当前行的值</title> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3Djavascript%3E%20%0D%0Avar%20selectedTr%3Dnull%3B%20%0D%0Afunction%20c1(obj)%7B%20%0D%0Aobj.style.backgroundColor%3D'blue'%3B%20%2F%2F%E6%8A%8A%E7%82%B9%E5%88%B0%E7%9A%84%E9%82%A3%E4%B8%80%E8%A1%8C%E5%8F%98%E5%B8%8C%E6%9C%9B%E7%9A%84%E9%A2%9C%E8%89%B2%3B%20%0D%0Aif(selectedTr!%3Dnull)%20selectedTr.style.removeAttribute(%22backgroundColor%22)%3B%20%0D%0Aif(selectedTr%3D%3Dobj)%20selectedTr%3Dnull%3B%2F%2F%E5%8A%A0%E4%B8%8A%E6%AD%A4%E5%8F%A5%EF%BC%8C%E4%BB%A5%E6%8E%A7%E5%88%B6%E7%82%B9%E5%87%BB%E5%8F%98%E7%99%BD%EF%BC%8C%E5%86%8D%E7%82%B9%E5%87%BB%E5%8F%8D%E7%81%B0%20%0D%0Aelse%20selectedTr%3Dobj%3B%20%0D%0A%7D%20%0D%0A%2F*%E5%BE%97%E5%88%B0%E9%80%89%E4%B8%AD%E8%A1%8C%E7%9A%84%E7%AC%AC%E4%B8%80%E5%88%97%E7%9A%84%E5%80%BC*%2F%20%0D%0Afunction%20check()%7B%20%0D%0Aif(selectedTr!%3Dnull)%7B%20%0D%0Avar%20str%3DselectedTr.cells%5B0%5D.childNodes%5B0%5D.value%3B%20%0D%0Adocument.getElementById(%22lab%22).innerHTML%3Dstr%3B%20%0D%0A%7D%20%0D%0Aelse%7B%20%0D%0Aalert(%22%E8%AF%B7%E9%80%89%E6%8B%A9%E4%B8%80%E8%A1%8C%22)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%2F*%E5%88%A0%E9%99%A4%E9%80%89%E4%B8%AD%E8%A1%8C*%2F%20%0D%0Afunction%20del()%7B%20%0D%0Aif(selectedTr!%3Dnull)%7B%20%0D%0Aif(confirm(%22%E7%A1%AE%E5%AE%9A%E8%A6%81%E5%88%A0%E9%99%A4%E5%90%97%3F%22))%7B%20%0D%0Aalert(selectedTr.cells%5B0%5D.childNodes%5B0%5D.value)%3B%20%0D%0Avar%20tbody%3DselectedTr.parentNode%3B%20%0D%0Atbody.removeChild(selectedTr)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Aelse%7B%20%0D%0Aalert(%22%E8%AF%B7%E9%80%89%E6%8B%A9%E4%B8%80%E8%A1%8C%22)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> </head> <body> 单击选中Tr，高亮显示，再单击取消选选中。<input type=button value="选中的是哪一行？" onclick="check()"> <input type=button value="删除选中行" onclick="del()"> <input type=button value="增加一行" onclick="add()"> <table width="100%" border="1" cellspacing="0" cellpadding="0" id="tab"> <tr onclick="c1(this);" bgcolor="#cccccc"> <td ><input type="text" value="11"> </td> <td><input type="text" value="12"></td> </tr> <tr onclick="c1(this);" bgcolor="#e0e0e0"> <td ><input type="text" value="21"> </td> <td><input type="text" value="22"></td> </tr> <tr onclick="c1(this);" bgcolor="#cccccc"> <td ><input type="text" value="31"> </td> <td><input type="text" value="32"></td> </tr> <tr onclick="c1(this);" bgcolor="#e0e0e0"> <td ><input type="text" value="41"> </td> <td><input type="text" value="42"></td> </tr> <tr onclick="c1(this);" bgcolor="#cccccc"> <td ><input type="text" value="51"> </td> <td ><input type="text" value="52"> </td> </tr> </table> <label id="lab"></label> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程