vue事件获取事件对象,vue获取事件源,vue event.currentTarget
js的事件,如点击事件,可以直接用this获取事件对象,而jQuery可以使用$(this)来获取事件对象。vue必须借助事件的 event 对象 的 currentTarget 才能获取事件对象
v-on:click="onClick( $event)"
onClick(e){
//jquery
$(e.currentTarget)
console.log(e)
// e.target 是你当前点击的元素
// e.currentTarget 是你绑定事件的元素
#获得点击元素的前一个元素
e.currentTarget.previousElementSibling.innerHTML
#获得点击元素的第一个子元素
e.currentTarget.firstElementChild
# 获得点击元素的下一个元素
e.currentTarget.nextElementSibling
# 获得点击元素中id为string的元素
e.currentTarget.getElementById("string")
# 获得点击元素的string属性
e.currentTarget.getAttributeNode('string')
# 获得点击元素的父级元素
e.currentTarget.parentElement
# 获得点击元素的前一个元素的第一个子元素的HTML值
e.currentTarget.previousElementSibling.firstElementChild.innerHTML
}
vue事件获取事件对象,vue获取事件源,vue event.currentTarget的更多相关文章
- jQuery-3.事件篇---事件对象的使用
jQuery事件对象的作用 事件中的Event对象容易被初学者忽略掉,可能大多时候初学者不知道怎么去用它,但有些时候它还是非常有用的 一个标准的"click"点击事件 $(elem ...
- ajax获取json对象
ajax获取json对象 ajax获取json数据,都是一个原理,设置response 的Content-Type:application/json,这样浏览器自动会解析为json对象 $result ...
- 【死磕 Spring】----- IOC 之 获取 Document 对象
原文出自:http://cmsblogs.com 在 XmlBeanDefinitionReader.doLoadDocument() 方法中做了两件事情,一是调用 getValidationMode ...
- React对比Vue(03 事件的对比,传递参数对比,事件对象,ref获取DOM节点,表单事件,键盘事件,约束非约束组件等)
import React from 'react'; class Baby extends React.Component { constructor (props) { super(props) t ...
- vue事件获取当前对象
一.事件传参 如点击事件 <div @click='click'> <div> <div @click='click_1('msg')'> <div> ...
- vue获取当前对象
<li v-for="img in willLoadImg" @click="selectImg($event)"> <img class=& ...
- jQuery通过event获取点击事件的事件对象
要想搞明白js的事件机制,必须搞清楚几个概念:事件对象,事件源,还有事件流 事件对象: 当事件发生时会产生事件对象,事件对象的作用是用来记录“事件发生是一些相关的信息.注意事件对象只有在事件发生时才会 ...
- DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理
事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window. ...
- js中获取事件对象的方法小结
原文地址:http://jingyan.baidu.com/article/d8072ac4594d6cec95cefdac.html 事件对象 的获取很简单,很久前我们就知道IE中事件对象是作为全局 ...
随机推荐
- Windows Apache httpd-vhosts.conf
<VirtualHost *:> DocumentRoot "D:\wamp\www" ServerName localhost </VirtualHost> ...
- java并发系列(八)-----java异步编程
同步计算与异步计算 从多个任务的角度来看,任务是可以串行执行的,也可以是并发执行的.从单个任务的角度来看,任务的执行方式可以是同步的,也可以是异步的. Runnable.Callable.Future ...
- Hibernate中的Query
//1:创建query对象,方法里面写hql语句 Query query = session.createQuery("from User"); //2:利用query对象中的方法 ...
- ZOJ3195 Design the city [2017年6月计划 树上问题04]
Design the city Time Limit: 1 Second Memory Limit: 32768 KB Cerror is the mayor of city HangZho ...
- Ubuntu小知识:更改主机名
Linux主机名是在安装Linux操作系统的过程中设定的,并作为网络中的某一台主机的唯一标志,但是在安装好Linux系统后,如果想修改主机名,该怎么办呢?本文介绍基于Ubuntu Desktop 9. ...
- 为什么无法定义1px左右高度的容器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...
- SQL优化系列(二)- 优化Top SQL
优化最耗资源的N条SQL语句 如何从SGA或者AWR中找出最消耗资源的SQL, 例如最慢的20条SQL, 然后逐条优化? SQL自动优化工具SQL Tuning Expert Pro for Orac ...
- 电影的微信小程序
最近,工作没有那么忙,学习了一下小程序开发,感觉上手比较简单. 在项目中学习是最好的方式,于是就自己模仿豆瓣电影开发一款微信小程序版的豆瓣电影 准备工作: 数据来源:豆瓣电影API 功能: 电影榜单列 ...
- JavaScript--返回顶部方法:锚链接、行内式js写法、外链式、内嵌式
返回网页顶部方法 一.锚链接 simpleDemo: <!DOCTYPE html> <html lang="en"> <head> <m ...
- MySQL数据库操作语句(补充1)(cmd环境运行)
一.字符串类型 enum枚举类型 /* 也叫做枚举类型,类似于单选! 如果某个字段的值只能从某几个确定的值中进行选择,一般就使用enum类型, 在定义的时候需要将该字段所有可能的选项都罗列出来: */ ...