点击table中的某一个td,获得这个tr的所有数据
功能: 点击table中的某一个td,获得这个tr的所有数据
效果图
<html> <head> <script> function getData2(element){ document.getElementById("name").value=element.children[0].innerHTML; document.getElementById("xuehao").value=element.children[1].innerHTML; } </script> </head> <body> <table border="1"> <tr > <td>学号</td> <td>姓名</td> </tr> <tr onclick=getData2(this) > <td>AAAAAAAAAAA</td> <td>张三 </td> </tr> <tr onclick=getData2(this) > <td>BBBBBBBBBB</td> <td>李四</td> </tr> </table> </br> </br> <input type="text" id="name" name="name" /> <input type="text" id="xuehao" name="xuehao" /> </body> </html>
当然还有另外一种方式,我直接在javascript里面给所有的tr加上onclick属性#
<html> <head> <script> function getData(){ document.getElementById("name").value=this.children[0].innerHTML; document.getElementById("xuehao").value=this.children[1].innerHTML; } </script> </head> <body> <table border="1"> <tr > <td>学号</td> <td>姓名</td> </tr> <tr > <td>AAAAAAAAAAA</td> <td>张三 </td> </tr> <tr > <td>BBBBBBBBBB</td> <td>李四</td> </tr> </table> </br> </br> <input type="text" id="name" name="name" /> <input type="text" id="xuehao" name="xuehao" /> <script type="text/javascript"> var tds=document.getElementsByTagName("tr"); var obj=null; for(var i=1,len=tds.length;i<len;i++){ obj=tds[i]; obj.onclick=getData; //这里没有括号 } </script> </body> </html>
对于这两种方法,我不懂的是为什么一个getData()没有参数,getData2(element)却有参数
点击table中的某一个td,获得这个tr的所有数据的更多相关文章
- table 中 文字长度大于td宽度,导致文字换行 解决方案
1.TD不换行 nowrap属性 表格table的td单元格中,文字长了往往会撑开单元格,但是如果table都不够宽了,就换行了好像(不要较真其他情况,我只说会换行的情况).换行后的表格显得乱糟糟,不 ...
- vb.net 使用 Regex Replace 正则 替换 Html字串的table中tbody第一个tr下的td为th
本次示例效果如下: TextBox1中输入如下字符串: 12<table><tbody><tr><td>1<br/>11</td> ...
- table中绝对定位元素相对td定位失效解决方案
开门见山! 问题:在一个table中,我需要在td里面绝对定位一个div, 写法:td{position:relative;} div{position:absolute;} OK,就这么简单,思路也 ...
- js遍历table中的每一个元素
function GetInfoFromTable(tableid) { var tableInfo = ""; var tableObj = document.getElemen ...
- JS实现点击table中任意元素选中
上项目开发,忙的焦头烂额,博客也没咋更新了. 昨天老师提了个需求,简单的小例子,选择tr中任一行选中tr,觉得很有意思,记录一下: 上代码 <!DOCTYPE html> <html ...
- javascript做的一个根据table中某个td的值为日期时的倒计时
JavaScript代码: <script> window.onload = window.onload = function () { getTdValue(); } //根据传过来的天 ...
- js穿梭框;将两个table中的数据选中移动
将table中选中的数据移动到右边: 点击一行中的任意一个位置,使其选中: 注:attr()和prop()都是jquery的方法: .attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 ...
- js的传值,table中tr的遍历,js中动态创建数组
1.这里关键是对页面中的传值,其次是动态的创建一个数组,用来存值 $(val).css("background-color", "rgb(251, 248, 233)&q ...
- table中tr或者td的点击事件
直接把时间添加到table或者tbody上,只有下面的tr或者td才能促发事件,通过e.target可以获得当前点击tr或者td,这样就可以进行查询或者删除操作了 如果是删除,直接e.target.r ...
随机推荐
- 大话XML解析
之前我写过一篇关于xml解析的文章:http://blog.csdn.net/sdksdk0/article/details/50749326.今天这篇文章主要是进一步加深对xml基础的理解了使用,毕 ...
- 理解 Linux 的硬链接与软链接
Linux 的文件与目录 现代操作系统为解决信息能独立于进程之外被长期存储引入了文件,文件作为进程创建信息的逻辑单元可被多个进程并发使用.在 UNIX 系统中,操作系统为磁盘上的文本与图像.鼠标与键盘 ...
- 【java多线程系列】java中的volatile的内存语义
在java的多线程编程中,synchronized和volatile都扮演着重要的 角色,volatile是轻量级的synchronized,它在多处理器开发中保证了共享变量的可见性,可见性指的是当一 ...
- Linux系统编程----孤儿进程
什么是孤儿进程? 孤儿进程, 指在父进程退出后,而子进程还在运行,这个子进程就成了孤儿进程,这时由init进程(pid=1)接管 来看看例子: #include <stdio.h> #i ...
- Hibernate超简单多表操作
所谓一对多映射 在数据库中我们通常会通过添加外键的方式将表关联起来,表现一对多的关系. 而在Hibernate中,我们则要通过在一方持有多方的集合来实现,即在"一"的一端中使用元素 ...
- Swift基础用法(Swift开发之一)
昨晚苹果发布了新一代编程语言Swift,官方提供了一个iBook的说明文档,有需要的可以看下.地址:https://itunes.apple.com/cn/book/swift-programming ...
- (NO.00004)iOS实现打砖块游戏(四):砖块类的实现
大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;) 用Xcode打开之前SpriteBuilder创建的项目,我们现 ...
- AnimatedPathView实现自定义图片标签
老早用过小红书app,对于他们客户端笔记这块的设计非常喜欢,恰好去年在小红书的竞争对手公司,公司基于产品的考虑和产品的发展,也需要将app社交化,于是在社区分享这块多多少少参照了小红书的设计,这里面就 ...
- JSON 的数据转换格式(DataTable或DataSet) -善良公社项目
这两天在使用JqueryEasyUI框架绑定数据并实现自动分页时,由于框架的限制需要使用Json数据的来传递与获取数据: JSON的全称是JavaScript Object Notation, 是一种 ...
- Linux的启动流程(一)
· 启动第一步--加载BIOS 当你打开计算机电源,计算机会首先加载BIOS信息,BIOS信息是如此的重要,以至于计算机必须在最开始就找到它.这是因为BIOS中包含了CPU的相关信息.设备启动顺序信息 ...