v-on:click获取当前事件对象元素

最新推荐文章于 2024-10-12 08:16:30 发布
最新推荐文章于 2024-10-12 08:16:30 发布
阅读量7.3k 收藏
点赞数
分类专栏： vue 文章标签： v-onclick event event.target
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/powderhose/article/details/73740977
版权

dom元素这样写:


<i @click="iconToogle($event)" class="iconfont icon-xuanzhong1"></i>


vue实例中的methods的写法:


function (event){   
    console.log($(event.target)

},

powderhose
关注
专栏目录
VUE初学---事件处理 v-on:click、v-on:keyup
qq_42970981的博客
11-22 3967
为什么在 HTML 中监听事件? 你可能注意到这种事件监听的方式违背了关注点分离 (separation of concern) 这个长期以来的优良传统。所有的 Vue.js 事件处理方法和表达式都严格绑定在当前视图的 ViewModel 上，它不会导致任何维护上的困难。实际上，使用 v-on 有几个好处： 扫一眼 HTML 模板便能轻松定位在 JavaScript 代码里对应的方法。 因为你无...
如何实现v-for循环出来的列表里面的click事件只对当前列表内的元素有效
洛神赋
06-16 9479
&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;script type="text/javascript" src="js/vue.js"&gt;&lt;/script&gt;&lt;/head&gt;&lt;body&gt; &lt;div id="app"&gt;
Vue v-for循环之@click点击事件获取元素示例
12-13
应用背景 浏览论坛的贴子（数据库的数据通过vue遍历在html页面上） 点击帖子的标题、图片，可以查看详细的帖子（点击事件获取id） 1、设置一个隐藏值的放置Id的div，点击div就获取id，传参到后台（点击一部分） <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Vue 测试实例 - 软件开发网(mscto.com)</title> [removed][removed] </head> <body> <div i
JavaScript：获取当前事件的元素
1111111111
03-04 4737
1、在监听事件里加入$event参数。 <div ref="cell" style="width: 75px;" @click="downloadData(items.filePath)" @mouseenter="mouseEnter(items.filePath,$event)" @mouseleave="mouseLeave($event)"> {{items.value}} </div>
vue @click获取当前被点击的元素
最新发布
qq_39006905的博客
10-12 184
首先 vue的点击事件 是用 @click = “clickfun()” 属性 在html中绑定的,在点击的函数中 添加$event 参数就可以。
vue中如何点击事件，获取该点击元素
子玉的博客
03-20 850
在上面的示例中，我们在``元素上添加了一个点击事件处理程序`@click="handleClick"`，当这个``元素被点击时，`handleClick`方法会被调用，并且传入一个事件对象`event`。通过`event.target`可以获取到被点击的元素。在Vue中，你可以通过事件处理程序（event handler）来监听点击事件，并通过事件对象（event object）获取点击的元素。
获取当前事件对象及this的用法
djaaa123456的博客
01-15 275
js <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &...
VUE 爬坑之旅-- v-for，v-on:click 使用需要注意的地方
热门推荐
Alex_Zhao 的博客
10-27 2万+
今天在写一个页面的时候，需要在一个 v-for 循环里面给每个 item 绑定一个点击事件，在这个事件中我需要拿到所点击 item 里面的数据和它的 index。
VUE中v-on:click事件中获取当前dom元素的代码
12-29
在开发中总是忘记，特意在此记录 关键字： $event <div class=bed v-on:click=updateBed...PS：下面看下v-on:click获取当前事件对象元素 dom元素这样写: <i @click=iconToogle($event) class=iconfont icon-
详解vue.js的事件处理器v-on:click
10-19
同时，`event`参数是原生的JavaScript事件对象，你可以从中获取关于触发事件的信息，比如触发事件的元素（`event.target`）。 ### 3. 事件修饰符 Vue.js提供了多种事件修饰符，它们可以改变事件处理器的行为： - ...
vue《一》（v-for,v-model,v-on:click指令学习）
键盘哥的博客
07-15 800
一，第一部分基本模型：&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;v-mode和v-for指令练习&lt;/title&gt; &lt;script src="https://c
触发onclick事件获取当前元素各个属性参数
Tarafireworks的博客
08-31 4325
自动生成元素的onclick事件 event.target返回触发事件的元素 event.currentTarget返回绑定事件的元素 <a onclick="test()">点击我</a> <script> function test(){ var is=event.currentTarget; console.log($(is)); //获取当前元素，类同this console.log(event.target); //返回绑.
vue基础：事件绑定,通过事件获取数据
谷咕咕
01-20 2190
1.vue中对方法（事件）的绑定的两种方法：v-onclick:="()“和@click=”*()" 需要注意的事在中调用的方法时，该方法需要在&lt;button v-on:click="run1()"&gt;执行方法的第一种写法&lt;/button&gt; data () { return { msg: '你好vue', list:...
获取当前月时间
bpluoxong的博客
07-15 206
vue时间获取
vue的@click绑定的方法如何获取当前标签
qq_30908729的博客
11-01 1748
vue的绑定的方法如何获取当前标签，比如@click 解决方法： 下面event.target就是当前标签 openOptionModal(event){ alert(event.target.value) } 点击事件绑定用法：http://yayihouse.com/yayishuwu/chapter/2204 ...
[iview]Tabs标签点击事件on-click
西格玛猫
05-31 7117
<template> <div> <Tabs type="card" @on-click="handleTabClick"> <TabPane label="标签一" name="name1">标签一</TabPane> <TabPane label="标签二" name="name2">标签二</TabPane> <TabPane label="标签三" name="name3">标签三
Dom 里定义的onclick怎样传入event事件
KevinMiGuan的博客
11-01 1万+
onclick自带event事件，代码如下： &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt;     &lt;meta charset="UTF-8"&gt;     &lt;title&gt;Document&lt;/title&gt; &lt;/head&gt; &lt;bod
Dom 中绑定onclick时间获取对象以及event的方法
qq_38761664的博客
07-04 8991
当Dom中绑定了click时间时，我们需要获取当前节点，可以在onclick事件中传值this来获取，例如： var oLi=$('') function Click(target){ var e=window.event || arguments.callee.caller.arguments[0]; e.preventDefault();         e.stopPropag
Vue事件处理详解：v-on指令与方法应用
简单的事件处理通常直接写在`v-on`中，但对于复杂的逻辑，比如需要访问组件内部状态或执行其他任务，应该将处理函数定义在`methods`对象中，如下例所示： ```javascript methods: { greet: function (event) { ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值