vue如何触发某个元素的单击事件?
<a class="link" @click.native="test">1111</a>
<a class="link" @click.native="test">2222</a>
<a class="link" @click.native="test">333</a> <button @test='shout'>点击我触发a的单击事件</button> <script type="text/javascript">
var vm = new Vue({
el:"#app",
methods: {
test: function () {
console.log(1);
this.$emit('test');//把a标签的点击事件分发
},
shout:function () {
console.log('我触发了它');
}
}
})
</script>
应该是这样的。待考察
vue如何触发某个元素的单击事件?的更多相关文章
- 解决内部元素onMouseOver/onMouseOut事件冒泡触发父元素的相应事件
前阵子为BS项目模板做了一个左侧滑动信息栏,效果类似于windows状态栏的自动隐藏效果,鼠标移进滑出,鼠标移出隐藏,浮动时不占用空间,也可以固定住占一块位置.做的过程中遇到一个问题,鼠标在信息栏内部 ...
- jQuery 双击事件(dblclick)时,不触发单击事件(click)
我这是转载的文字 原文地址:http://www.cnblogs.com/wyblog/archive/2011/12/15/2289219.html 万恶的双击事件啊!! 在jQuery的事件绑定中 ...
- [转]jQuery 双击事件(dblclick)时,不触发单击事件(click)
例1: 链接:http://www.w3school.com.cn/jquery/event_dblclick.asp HTML 系列教程 浏览器脚本 服务器脚本 ASP.NET 教程 XML 系列教 ...
- JQuery如何实现双击事件时不触发单击事件
单击和双击事件的执行顺序: 单击(click):mousedown,mouseout,click: 双击(dblclick):mousedown,mouseout,click , mousedown, ...
- 【转载】设置event.cancelBubble,使触发子元素的onclick不同时触发父元素的onclick
由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...
- jquery——ajax加载后的内容,单击事件失效
使用delegate(),on()绑定事件,可以将事件绑定到其祖先元素上,这样以后加载出来的元素,单击事件仍然有效
- vue 表格阻止父元素冒泡事件
思路如下:1.给复选框定义一个类型,type="selection" 2.在点击函数中就可以使用判断条件来进行复选框的阻止冒泡.rowDetailShow(row, event, ...
- 实例化vue之前赋值html元素导致事件失效
先实例化Vue对象,再操作其他对象,Vue对象声明时会渲染html容器内的所有元素, 会导致元素事件失效或dom元素重新创建,所以涉及html元素的对象都要在实例化Vue之后执行. 下面是简要的例子, ...
- jquery双击事件会触发单击事件
实际工作中,我们经常会遇到在同一个元素上,绑定多种事件类型,比较常见的是单击事件和一些鼠标事件,一般而言影响不大.但是如果同时绑定单击事件和双击事件呢? 其实,只要能够想明白的话,解决方案也比较简单, ...
随机推荐
- 地球椭球体(Ellipsoid)、大地基准面(Datum)及地图投影(Projection)三者的基本概念
地球椭球体(Ellipsoid) 众所周知我们的地球表面是一个凸凹不平的表面,而对于地球测量而言,地表是一个无法用数学公式表达的曲面,这样的曲面不能作为测量和制图的基准面.假想一个扁率极小的椭圆,绕大 ...
- JBOSS安装与配置搭建本地项目环境(方便前端开发调式)
JBOSS安装与配置搭建本地项目环境 什么是JBOSS? JBOSS是EJB的服务器,就像Tomcat是JSP服务器一样,就是服务器的一种. 环境搭建如下: 一:首先安装JDK,配置环境变量(PAT ...
- Windows/Linux获取当前运行程序的绝对路径
windows 获取当前运行程序的绝对路径(.exe) GetModuleFileNameA()函数获取绝对路径,不过文件路径中的反斜杠需要进行替换. ]; GetModuleFileNameA(NU ...
- jqgrid 设置多表头
有时,我们需要给jqgrid设置多表头信息,多表头区域会有行合并/列合并,如何实现? 1)通过jqgrid的 setGroupHeaders 方法来实现一个行的多表头, 2)如果有多行表头,需要设置多 ...
- Java Web乱码分析及解决方案
1. 什么是URL编码. URL编码是一种浏览器用来打包表单输入的格式,浏览器从表单中获取所有的name和其对应的value,将他们以name/value编码方式作为URL的一部分或者分离的发送到服 ...
- SqlServer执行大的数据库脚本出错解决方法
如果执行线上项目拷下来sqlserver的.sql的数据库脚本文件,如果文件较大时,那么就会报错内存不足之类的. 这时可以在命令提示符使用命令来执行脚本文件.切记,执行前先改一下数据库存放位置! 命令 ...
- 大数据入门第十五天——HBase整合:云笔记项目
一.功能简述 1.笔记本管理(增删改) 2.笔记管理 3.共享笔记查询功能 4.回收站 效果预览: 二.库表设计 1.设计理念 将云笔记信息分别存储在redis和hbase中. redis(缓存):存 ...
- 20155210 实验一 逆向与Bof基础
20155210 实验一 逆向与Bof基础 实验内容 1.直接修改程序机器指令,改变程序执行流程 下载目标文件pwn1,反汇编 利用objdump -d pwn1对pwn1进行反汇编 得到: 8048 ...
- pandas 索引与列相互转化
1. 准备数据 import pandas as pd from io import StringIO csv_txt = '''"date","player1" ...
- JavaScript实现选项卡(三种方法)
本文实例讲述了js选项卡的实现方法. 一.html代码: <div id="div1"> <input class="active" type ...