JQuery onclick事件

时间：2024-11-17 14:21:54
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>

<script src="./" type="text/javascript" charset="utf-8"></script>
<script>
	function showName(obj){
		var thisObj = $(obj) //js对象转jquery对象
		var span = ().prev().prev().prev().children('span');
		();
		var p = ().prev().prev().prev().children('p');
		();
		// (td);
	}
</script>
<body style="width:100% margin:0 auto">
	<table border="1" style="margin:0 auto">
		<tr>
			<th width="100">姓名</th>
			<th width="100">性别</th>
			<th width="100">年龄</th>
			<th width="150">操作</th>
		</tr>
		<tr>
			<td><span style="display:none">隐身</span><p>Lisen</p></td>
			<td>男</td>
			<td>18</td>
			<td><a href="javascript:;" onclick="showName(this)">隐藏/显示姓名</a></td>
		</tr>
		<tr>
			<td><span style="display:none">隐身</span><p>Joker</p></td>
			<td>男</td>
			<td>18</td>
			<td><a href="javascript:;" onclick="showName(this)">隐藏/显示姓名</a></td>
		</tr>
		<tr>
			<td><span style="display:none">隐身</span><p>Mike</p></td>
			<td>男</td>
			<td>18</td>
			<td><a href="javascript:;" onclick="showName(this)">隐藏/显示姓名</a></td>
		</tr>
	</table>
	
</body>
</html>

onclick(this)，传值this可以通过()打印，可以看到打印的结果是a标签本身，可以得到a标签本身的属性，如果想通过this传值得到其他标签，则需要将js对象，转化为jquery对象

var thisObj = $(obj) //js对象转jquery对象，这句是必要的

否则不能得到父节点的相关内容，当然，如果只要得到当前标签的内容和属性，就不需要上面的代码

运行效果：

点击第一个“隐藏/显示姓名”

再次点击会显示

相关文章