点击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 ...
随机推荐
- Redis之(七)主从同步与集群管理
8.1 主从同步原理 像MySQL一样,Redis是支持主从同步的,而且也支持一主多从以及多级从结构. 主从结构,一是为了纯粹的冗余备份,二是为了提升读性能,比如很消耗性能的SORT就可以由从服务器来 ...
- Java格式化时间
Java格式化时间 将秒或者毫秒值格式化成指定格式的时间 效果图 工具类 工具类里我只列出了一种格式的格式化方式,可以根据自己的需求,修改"yyyy-MM-dd hh:mm:ss" ...
- /proc/stat 详解
在Linux系统中,可以用/proc/stat文件来计算cpu的利用率.这个文件包含了所有CPU活动的信息,该文件中的所有值都是从系统启动开始累计到当前时刻. cat /proc/stat cpu 6 ...
- [error]error while loading shared libraries: libpcre.so.1 解决
nginx 安装好之后,启动的时候报错 [root@localhost nginx-1.6.2]# /usr/local/nginx/sbin/nginx /usr/local/nginx/sbin ...
- iOS7编程Cookbook中例15.8中一个小问题
大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 该书的15.8例子标题为Editing Videos on a ...
- 实现一个最简单的VIM文本编辑器(可能有bug,随便写了一个)
简单的写了一个文本编辑器,功能很简单,但足以把文件IO相关的操作熟悉了,可能功能或者分配的大小还不够完善.请参考参考: #include <stdio.h> #include <co ...
- socket系列之客户端socket——Socket类
假设TCP套接字服务器端已经建立好并正在监听客户端的连接了,那么客户端就可以通过Socket类来发起连接.客户端发起一个连接请求后,就被动地在等待服务器的响应.这个类同样位于java.net包中,包含 ...
- openfire环境搭建
1.下载源代码:http://www.igniterealtime.org/downloads/source.jsp 2.把源代码解压出的openfire_src文件夹放至eclipse workpl ...
- iOS的settings bundle中开关按钮(Toggle Switch)取不到值的问题
大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 在Xcode7.2中设置App的settings bundle ...
- 【一天一道LeetCode】#223. Rectangle Area
一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Find th ...