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中事件对象是作为全局 ...
随机推荐
- 通过游戏学python 3.6 第一季 第四章 实例项目 猜数字游戏--核心代码--猜测次数--随机函数和屏蔽错误代码--优化代码及注释 可复制直接使用 娱乐 可封装 函数
#猜数字--核心代码--猜测次数--随机函数和屏蔽错误代码---优化代码及注释 #!usr/bin/env python #-*-coding:utf-8-*- #QQ124111294 import ...
- jquery版本冲突问题
开发过程中,我们常常会遇到这种问题: 我们需要做一个新的功能,需要插入一个新的插件,使用新版的jquery,但原版的jquery已经被很多函数使用,不能直接修改.这时候我们可以现将$转移给$170($ ...
- Centos 设置时区
参考网址: http://jingyan.baidu.com/article/636f38bb268a82d6b84610bd.html //打开设置 tzselect //选择 )Asia → )c ...
- pc端样式重置以及常用样式规范class
//reset html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a ...
- codeforces 545E E. Paths and Trees(单源最短路+总权重最小)
E. Paths and Trees time limit per test:3 seconds memory limit per test:256 megabytes input:standard ...
- WPF 的另类资源方式 Resources.resx
类似Winform的搞法,可以把资源放到Resources.resx中. 1.字符串 打开这个编辑器后,输入Name和Value就可以了. CS代码里面,很简单的调用: var title = W ...
- 大量的Close_wait 发现的 too many open file 错
突然频繁出现大量的 Close_wait,查看程序日志,发现 connection 在 accept 时报错,Too many open file. 估计程序里有这个漏洞,当 accept 时报错,没 ...
- jeecg流程梳理学习
jeecg 流程梳理 角色admin 管理员 fgld学校分管领导 bgs学校办公室 xbld系部领导 xbky系部科员jxky bmld部门领导 发文申请applyUserIdadmin${assi ...
- MySQL数据库起步 关于数据库的基本操作(更新中...)
mysql的基本操作 连接指定的服务器(需要服务器开启3306端口) mysql -h ip地址 -P 端口号 -u 账号 -p 密码 删除游客模式 mysql -h ip地址 -P 端口号 -u 账 ...
- oracle function学习1
oracle function学习基层: 函数就是一个有返回值的过程. 首先 知道oracle 使用限制: 函数调用限制: 1. SQL语句中只能调用存储函数(服务器端),而不能调用客户端 ...