改变链接(<a>)中的onclick事件

JS与jQuery修改点击事件

最新推荐文章于 2021-06-04 08:39:36 发布

原创最新推荐文章于 2021-06-04 08:39:36 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #链接

JS 专栏收录该内容

3 篇文章

订阅专栏

本文介绍使用纯JavaScript和jQuery两种方式来改变HTML中链接的点击事件。通过具体实例展示了如何利用这两种方法来动态更新<a>标签内的onclick属性。

部署运行你感兴趣的模型镜像

需求：点击按钮之后改变链接(<a>)中的onclick事件

方法一：纯js实现

<html>
	<head>
		<script>
		function change(){
			var a = document.getElementById("link");
			a.onclick = function(){};
			a.onclick = method1;
		}

		function method1(){
			alert('bb');
		}
		</script>
	</head>
	<body>
		<a href="javascript:;" onclick="alert('aa')" id="link">link</a>
		<br/>
		<input type="button" onclick="change()" value="button"/>
	</body>
</html>

方法二：jquery1.4.4实现

<html>
	<head>
		<script src="jquery-1.4.4.js"></script>
		<script>
		function change(){
			var a = $("#link");
			a.attr("onclick","");
			a.bind("click",method1);
		}

		function method1(){
			alert('bb');
		}
		</script>
	</head>
	<body>
		<a href="javascript:;" onclick="alert('aa')" id="link">link</a>
		<br/>
		<input type="button" onclick="change()" value="button"/>
	</body>
</html>

如上只是两种简单的实现。

您可能感兴趣的与本文相关的镜像