标签:span strong can nbsp box default class 回车 context
一、事件对象:
click="show($event)"
二、事件冒泡:
阻止冒泡:(1) ev.cancelBubble=true;
<script> window.onload=function(){ new Vue({ el:"#box", data:{}, methods:{ show:function(ev){ ev.cancelBubble=ture; }, show2:function(){ alert(2); } }, }) } </script> <div id=box> <div @click="show2()"> <input type="button" value="按钮" @click="show($even)"> </div> </div>
(2) @click.stop(推荐)
<script> window.onload=function(){ new Vue({ el:"#box", data:{}, methods:{ show:function(ev){ alert(1); }, show2:function(){ alert(2); } }, }) } </script> <div id=box> <div @click="show2()"><input type="button" value="按钮" @click.stop="show()"></div> </div>
三、默认事件:contextmenu(右键)
阻止默认行为:(1) ev.preventDefault;
<script> window.onload=function(){ new Vue({ el:"#box", data:{}, methods:{ show:function(ev){ alert(1); ev.preventDefault(); } }, }) } </script> </head> <body> <div id=box> <div @click="show2()"> <input type="button" value="按钮" @contextmenu="show($event)"> </div> </div>
(2) @contextmenu.prevent(推荐)
<script> window.onload=function(){ new Vue({ el:"#box", data:{}, methods:{ show:function(ev){ alert(1); } }, }) } </script> </head> <body> <div id=box> <div @click="show2()"> <input type="button" value="按钮" @contextmenu.prevent="show()"> </div> </div> </body>
四、键盘
@keydown $event ev.keyCode
@keyup
五、常用键
回车 :
(1)@keyup.13
(2)@keyup.enter
标签:span strong can nbsp box default class 回车 context
原文地址:http://www.cnblogs.com/sun927/p/7127317.html