js阻止默认事件的方法

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js阻止默认事件的方法相关的知识,希望对你有一定的参考价值。

参考技术A js阻止默认事件的方法是preventDefault。
浏览器会给事件预设一定的默认事件处理,使用这个方法可以阻止默认事件,防止默认事件影响当前的程序。

vue.js阻止事件冒泡和默认事件

首先我们来看原生JS取消事件冒泡方法:

e.stopPropagation(); //非IE浏览器
window.event.cancelBubble = true; //IE浏览器

原生JS阻止默认事件方法:

e.preventDefault(); //非IE浏览器
window.event.returnValue = false; //IE浏览器

而vue.js给我们提供了更简便的方法,我们可以通过function($event)来获取事件对象,$event.target则是选择发生事件的目标元素:

//HTML
<p @click="getEventTar($event)">Test</p>
//JS
getEventTar(el){
console.log(el.target); //<p>Test</p>,这里就相当于通过原生JS获取DOM元素而后可以对其进行一些操作
}

vue.js取消冒泡事件
//只需将click改成click.stop
<p @click.stop="getEventTar($event)">Test</p>

vue.js阻止默认事件
//只需将click改成click.prevent
<p @click.prevent="getEventTar($event)">Test</p>

以上是关于js阻止默认事件的方法的主要内容,如果未能解决你的问题,请参考以下文章

js阻止冒泡和默认事件(默认行为)详解

阻止默认事件,滚轮事件与滚动事件

为啥阻止a标签的默认事件

js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件

vue.js阻止事件冒泡和默认事件

JS阻止事件冒泡与浏览器默认行为