事件对象:

            <input type="button" name="" value="按钮" @click="show($event)">
methods: {
show: function(ev) {
alert(ev.clientX);
alert(ev.clientY);
}
}

事件冒泡:

            <div @click="show2()">
<input type="button" name="" value="按钮" @click.stop="show()">
</div>
methods: {
show: function() {
alert(111);
//原生的写法
//ev.cancelBubble = true;
},
show2: function() {
alert(222);
}
}

阻止事件默认行为:

            <input type="button" name="" value="按钮" @contextmenu.prevent="show()">
methods: {
show: function() {
alert(111)
},
show2: function() {
alert(222)
}
}

vue事件对象、冒泡、阻止默认行为的更多相关文章

  1. Vue 事件修饰符 阻止默认事件

    阻止默认事件: <a v-on:click.prevent="doThat"></a>

  2. vue 事件上加阻止冒泡 阻止默认事件

    重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...

  3. 前端(十五)—— JavaScript事件:绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  4. 从零开始的全栈工程师——js篇2.21(事件对象 arguments 阻止事件默认行为兼容 事件委托 事件源对象)

    一.事件对象 1.常用的事件2.每个元素身上的事件都是天生存在的 不需要我们去定义 只需要我们给这个事件绑定一个方法 当事件触发的时候就会执行这个方法 3.事件绑定的写法 ①div.onclick=f ...

  5. 事件处理 及冒泡 阻止默认事件 以及tab 切换的思路

    1.axios post通过点击事件提交数据不需要使用input直接使用state2.pdd你好天天象上默认执行点击(1,2,3)也可以执行并且能切换页码3.tab 针对新闻不同时4.天天象上首页和精 ...

  6. 微信小程序入门学习之事件 事件对象 冒泡非冒泡事件(1)

    这关于事件的学习,可以自己复制到微信开发者工具上自己运行试试. 首先这里有两个文件.js 和.wxml 文件 首先给出.js文件下代码 // pages/news/news.js Page({ /** ...

  7. 从零开始的全栈工程师——js篇2.20(事件对象 冒泡与捕获)

    一.复习 面向对象 1)单例模式 2)工厂模式 3)构造函数 ①类js天生自带的类 基类object function array number math boolean date regexp st ...

  8. vue.js 自带阻止默认事件 阻止冒泡

    <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a>   <!-- 提交事件不再重载页面  ...

  9. 这可能是最简明扼要的 js事件冒泡机制+阻止默认事件 讲解了

    哎 js事件冒泡机制和阻止冒泡 阻止默认行为好像永远也整不清楚,记了忘 忘了记...醉了 这篇文章写完以后下次再忘记 就呼自己一巴掌,忘一次一巴掌 首先要明白两个概念——事件和事件流 事件指的是用户或 ...

随机推荐

  1. Django时区的解释

    https://segmentfault.com/q/1010000000405911

  2. 【转】ArcGIS10.0完全卸载全攻略

    ArcGIS10.0完全卸载详细步骤: 1.开始>控制面板>添加删除程序,卸载所有ArcGIS软件和帮助文档,以及所有ArcGIS补丁.2.从添加删除程序面板中删除所有Python相关的应 ...

  3. 2018牛客网暑假ACM多校训练赛(第四场)A Ternary String 数论

    原文链接https://www.cnblogs.com/zhouzhendong/p/NowCoder-2018-Summer-Round4-A.html 题目传送门 - https://www.no ...

  4. OpenSSL-Win64创建IdentityServer证书

    d:cd xx C:\OpenSSL-Win64\bin\openssl req -newkey rsa:2048 -nodes -keyout identity.key -x509 -days 36 ...

  5. Hdu-1098解题报告

    Hdu-1098解题报告 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1098 题意:已知存在一个等式f(x)=5*x^13+13*x^5+k*a*x ...

  6. JavaEE 之 Spring Data JPA(二)

    1.JPQL a.定义:Java持久化查询语言(JPQL)是一种可移植的查询语言,旨在以面向对象表达式语言的表达式,将SQL语法和简单查询语义绑定在一起·使用这种语言编写的查询是可移植的,可以被编译成 ...

  7. Nowcoder contest 392 I 逛公园 (无向图割边模板)

    <题目链接> 题目描述: 月月和华华一起去逛公园了.公园很大,为了方便,可以抽象的看成一个N个点M条边的无向连通图(点是景点,边是道路).公园唯一的入口在1号点,月月和华华要从这里出发,并 ...

  8. POJ 1321-棋盘问题【DFS+递归】

    题目链接 题目大意: Description 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大 ...

  9. valueof toString

    valueof toString add(1)(2) // 3 add(1, 2, 3)(10) // 16 add(1)(2)(3)(4)(5) // 15 function add() { var ...

  10. BeagleBone Black 从零到一 (2 MLO、U-Boot) 转

    文章原址:jexbat.com/categories/BeagleBone/ 什么是 U-Boot 熟悉嵌入式开发的应该都听过它,U-boot 就是启动系统前的一段引导程序,虽然是引导程序,但是功能非 ...