JS如何阻止冒泡和默认跳转事件

最新推荐文章于 2023-06-11 17:30:06 发布

卖萌_先森

最新推荐文章于 2023-06-11 17:30:06 发布

阅读量291

点赞数 1

本文链接：https://blog.csdn.net/qq_36949892/article/details/92839097

版权

html 同时被 3 个专栏收录

17 篇文章 0 订阅

订阅专栏

javascript

11 篇文章 0 订阅

订阅专栏

jQuery

4 篇文章 0 订阅

订阅专栏

JS阻止冒泡事件

<script type="text/javascript">
	document.onclick = function (e){
		// 阻止冒泡事件
		e.stopPropagation();
	}
</script>

jQuery阻止冒泡事件

<a href="#" id="a"></a>
<script type="text/javascript">
	$(function (){
		$("a").on("click",function (e){
			//阻止冒泡事件
			e.stopPropagation();
		})
	})
</script>

JS阻止跳转事件

阻止a标签的默认跳转事件

<body>
		<a href="#" id="a">点击</a>
		<script type="text/javascript">
			document.getElementById("a").onclick = function (e){
				// 阻止默认跳转事件
				e.preventDefault();
			}
		</script>
</body>

可以设置a标签的href标签的属性的值，同样可以阻止跳转事件。

<a href="javascript:;" id="a">点击</a>

也可以使用return false

<body>
		<a href="#" id="a">点击</a>
		<script type="text/javascript">
			document.getElementById("a").onclick = function (e){
				// 阻止默认跳转事件
				return false;
			}
		</script>
</body>

jQuery阻止默认跳转事件

使用preventDefault方法

<a href="#" id="a"></a>
	<script type="text/javascript">
		$(function (){
			$("a").on("click",function (e){
				//阻止默认跳转事件
				e.preventDefault();
		})
	})
</script>

使用return false

<a href="#" id="a"></a>
	<script type="text/javascript">
		$(function (){
			$("a").on("click",function (e){
				//阻止跳转事件
				return false;
		})
	})
</script>

卖萌_先森

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS如何阻止冒泡和默认跳转事件

JS阻止冒泡事件<script type="text/javascript"> document.onclick = function (e){ // 阻止冒泡事件 e.stopPropagation(); }</script>jQuery阻止冒泡事件<a href="#" id="a"></a><script type...
复制链接

扫一扫

专栏目录