前端HTML,单击在table中某一行按钮,获得该行的数据
lingle1 2020-04-22 17:17:31 3101 收藏
补充,前一种按钮是input-button标签的,但是如果是button标签呢,该如何获取
2次补充,这个没啥用,就记录下,应该能用到
效果
在这里插入图片描述
代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title> 页面名称 </title>
</head>
<body>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<table id="tab">
<tr>
<td>aaaaa111</td>
<td>aaaaa222</td>
<td><input type="button" value="button" /></td>
</tr>
<tr>
<td>bbbbb111</td>
<td>bbbbb222</td>
<td><input type="button" value="button" /></td>
</tr>
<tr>
<td>ccccc111</td>
<td>ccccc222</td>
<td><input type="button" value="button" /></td>
</tr>
<tr>
<td>ddddd111</td>
<td>ddddd222</td>
<td><input type="button" value="button" /></td>
</tr>
</table>
<input type="text" id="text" />
<script type="text/javascript">
$(function() {
$("#tab").on("click", ":button", function(event) {
$("#text").val( $(this).closest("tr").find("td").eq(0).text() +"--"+$(this).closest("tr").find("td").eq(1).text());
});
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
参考:https://bbs.csdn.net/topics/392306236
补充,前一种按钮是input-button标签的,但是如果是button标签呢,该如何获取
只要js方法换成带参数的方法,调用参数的时候带上参数就行,不同情况不同用法,仅做记录,活学活用
ul+='<button onclick="pay(\''+regiId+'\')" >按钮</button>' //此为原生JS页面拼接//此方式的关键就在于转义字符
//regiId 为变量
<button onclick="pay('+regiId+')" >按钮</button>
//regiId 为变量
function pay(reg) {
//reg 为变量,可随意
alert(reg)
}
1
2
3
4
5
6
7
8
9
10
11
2次补充,这个没啥用,就记录下,应该能用到
<input type="button" name="modify" οnclick="aaa()" value="修改" />
function aaa(){
var u_id = '你的id值';
location.href = modifyUser.php?user=u_id
}
方法二
<input type="button" name="modify" οnclick="var u_id = document.getElementById('u_id').value;location.href='modifyUser.php?user=u_id';" value="修改" />