修改onclick事件的值

修改onclick事件的值
<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>修改onclick事件的值</title>
<link rel="stylesheet" type="text/css" href="top6.css" />
<link rel="stylesheet" type="text/css" href="mark.css">
<link rel="stylesheet" type="text/css" href="body.css">
<style type="text/css">
a {
	height: 25px;
	line-height: 25px;
	padding: 0 11px;
	background: #5136e7;
	border: 1px #ff0000 solid;
	border-radius: 5px;
	color: #fff;
	display: inline-block;
	text-decoration: none;
	font-size: 15px;
	outline: none;
	cursor:pointer; /*鼠标小手形状*/
}

</style>
</head>
<body>
	<center>
	<br><br>
	<h2>修改onclick事件的值</h2>
		<a id="test1" onclick="test(this)">测试1</a> <br><br><a id="test2"
			onclick="test(this)">测试2</a><br><br>
			<a id="test3" onclick="test(this)">测试3</a> <br><br>
			<a id="test4" onclick="test(this)">测试4</a> <br><br>
			<a id="test5" onclick="test(this)">测试5</a> <br><br>
			<a id="test6" onclick="test(this)">测试6</a> <br><br>
			<input onclick="cleanANodeOnclick()" type="button" value="清除A标签中的onclick属性的值"><br><br>
			<button onclick="alert('我是按钮，我按钮中有一张图片');"><img title="测试图片" src="${pageContext.request.contextPath}/img/2.jpg"></button>
	</center>
</body>
<script type="text/javascript">
	function test(myself) {
		alert(myself.id);
	}
	
	function test2(myself) {
		alert("我的id=" + myself.id);
	}
	
	function test3(myself) {
		alert("hello,我的id=" + myself.id);
	}
	
	function show(index, id){
		alert(index + " / " + id);
	}
	
	function cleanANodeOnclick(){
		
		var aNodes = document.getElementsByTagName("A");
		alert("aNodes是个数组对象，数组中有6个元素，最大下标是5，我这里为了测试，故意数组越界，看下aNodes[6]打印出来是什么。" + aNodes[6]);
		for (var index = 0; index < aNodes.length; index++) {
			alert(aNodes[index].id + " index = " + index);
			aNodes[index].id = index;
			/*
			javascript动态改变onclick事件,可以参
			考网址https://www.cnblogs.com/xiaoliu66007/p/5460119.html
			*/
			//aNodes[index].onclick = Function("test3(this);");
			//aNodes[index].onclick = function(){test2(this);};
			var myNode = aNodes[index].id;
			//alert("=" + myNode);
			/*
			可能会产生闭包的问题
			下面的function中的index永远都是aNodes数组的最后一个元素下标加1
			*/			
			aNodes[index].onclick = function(){alert(index + " / sss /" + myNode);show(aNodes[index], "aaa / " + index + " / " + aNodes);};
		}
	}
</script>
</html>
修改onclick事件的值

猜你喜欢
