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

更新日期: 2019-03-16阅读: 2.2k标签: 冒泡

首先我们来看原生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>



链接: https://www.fly63.com/article/detial/2402

原生js实现冒泡排序算法,javascript冒泡排序

javascript冒泡排序的实现,冒泡排序是一个非常常见的排序算法,对于一个数组,每趟排序时依次比较两个相邻的数,如果他们的顺序错误就交换两数位置。

JavaScript实现的几种排序:冒泡排序、选择排序、插入排序、归并排序

原生js实现排序算法:冒泡排序、选择排序、插入排序、归并排序等

React 事件冒泡

在React中,我们可以在创建element的时候,传入事件和处理函数,这些事件会被做为合成事件来处理,当然,有些时候,我们也需要定义原生事件,比如给document绑定事件。有些情况下,就需要通过阻止事件冒泡来实现预期的交互效果。下面是几个简单的demo

js中什么是事件冒泡?

在一个对象上触发某类事件,这个事件会向这个对象的的父级传播,从里到外,直至它被处理或者到达了对象层次的最顶层,即document对象。这个过程就是JavaScript的事件冒泡。

Js阻止冒泡和取消默认事件(默认行为)

js冒泡和捕获是事件的两种行为,使用event.stopPropagation()起到阻止捕获和冒泡阶段中当前事件的进一步传播。使用event.preventDefault()可以取消默认事件。

vue里面如何阻止事件冒泡 - 阻止click事件冒泡方法总汇

方法一:使用vue阻止子级元素的click事件冒泡。简单得:可以直接用stop;这样点击div里面的按钮1,就不会触发div绑定时间test1()方法。可以自己写个阻止冒泡事件 然后在发生冒泡的元素中调用这个事件

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!