Vue可以传递$event对象

<body id="app">

  <ul>

    <li @click="say('hello!', $event)">点击当前行文本</li>

    <li>li2</li>

    <li>li3</li>

  </ul>

  <script>

   new Vue({

       el: '#app',

       data: {

        message: 'Hello Vue.js!'

       },

       methods: {

        say: function(msg, event) {

           //获取点击对象

           var el = event.currentTarget;

           alert("当前对象的内容："+el.innerHTML);

        }

    }

   })

  </script>

 </body>

currentTarget：currentTarget 事件属性返回其监听器触发事件的节点，即当前处理该事件的元素、文档或窗口。

通俗一点说，就是你的点击事件绑定在哪一个元素上，currentTarget获取到的就是哪一个元素。

Event对象的一些兼容性写法

//获得event对象兼容性写法

event || (event = window.event);

//获得target兼容型写法

event.target||event.srcElement

//阻止浏览器默认行为兼容性写法

event.preventDefault ? event.preventDefault() : (event.returnValue = false);

//阻止冒泡写法

event.stopPropagation ? event.stopPropagation() : (event.cancelBubble = true);

vue click事件获取当前元素属性的更多相关文章

  1. （四）Jsoup 获取 DOM 元素属性值

    第一节: Jsoup 获取 DOM 元素属性值 Jsoup获取DOM元素属性值 比如我们要获取博客的href属性值: 我们这时候就要用到Jsoup来获取属性的值 : 我们给下示例代码: package ...

  2. Vue自定义指令获取DOM元素

    我们知道,Vue.js的核心是数据驱动,当数据有所变化时,DOM就会被更新,比如: <span v-text="msg"></span> export de ...

  3. vue 使用ref获取DOM元素和组件引用

    在vue中可以通过ref获取dom元素,并操作它,还可以获取组件里面的数据和方法. HTML部分: <div id="app"> <input type=&quo ...

  4. JAVA解析HTML，获取待定元素属性

    Document doc = Jsoup.parseBodyFragment(previewHtml); //html内容解析为Document int index = 0; StringBuffer ...

  5. vue.js click点击事件获取当前元素对象

    Vue.js可以传递$event对象 <body id="app"> <ul> <li v-on:click="say('hello!', ...

  6. JQuery通过click事件获取当前点击对象的id,name,value属性等

    $(".test").click(function () { var val=$(this).attr("id"); })

  7. vue之$event获取当前元素的节点

    <p @click = “clickfun($event)”>点击</p> methods: { clickfun(e) { // e.target 是你当前点击的元素 // ...

  8. vue click事件 v-on:click

    v-on:click <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  9. Jsoup（四）-- Jsoup获取DOM元素属性值

    1.获取博客园的博客标题以及博客地址,获取友情链接 2.代码实现: public static void main(String[] args) throws Exception{ // 创建http ...

随机推荐

  1. (STM32F4) Timer 基本操作

    Timer (計時器) 就是慢慢數時間,在timer內部有一個計數器. 而計數器會數到Register的value當數值數到設定值Timer就會發起IRQ 而程式就會轉跳到中斷向量裡頭去執行想要做的事 ...

  2. Jenkins windows部署

    1.安装jenkins 进入https://jenkins.io/download/,下载windows安装包,解压后运行jenkins.msi进行安装. 配置jenkins (1)打开http:// ...

  3. MVC流程

    控制器:调用模型,并调用视图,将模型产生数据传递给视图,并让相关视图去显示 模   型:获取数据,并处理返回数据 视   图:是将取得的数据进行组织.美化等,并最终向用户终端输出 第一步 浏览者 -& ...

  4. Git学习系列之集中式版本控制系统vs分布式版本控制系统

    不多说,直接上干货! Linus一直痛恨的CVS及SVN都是集中式的版本控制系统,而Git是分布式版本控制系统,集中式和分布式版本控制系统有什么区别呢? 先说集中式版本控制系统,版本库是集中存放在中央 ...

  5. Log4J2 配置文件模板及代码说明

    Log4j是Apache的著名项目,随着Java应用的越来越广泛,对日志性能等方面的要求也越来越高.Log4j的升级版本Log4j2在前些年发布.Log4J2的优点和好处有很多,可以自行搜索查阅相关文 ...

  6. nginx内网代理为外网地址

    #user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #erro ...

  7. 「Sdchr 的邀请赛」题解

    骗个访问量.. A:取石子 将点 x 与点 x / prime 连边,那么这个图可以由指数之和的奇偶性来划分成一个二分图. 接下来考虑推广阶梯 NIM (或者这原本就是阶梯 NIM ?),必胜当且仅当 ...

  8. [转]使用依赖关系注入在 ASP.NET Core 中编写干净代码

    本文转自:http://blog.jobbole.com/101270/ 原文出处: Steve Smith    ASP.NET Core 1.0 是 ASP.NET 的完全重新编写,这个新框架的主 ...

  9. Magento 2开发教程 - 如何添加新产品属性

    添加产品属性是一种在Magento 1 和 Magento 2最受欢迎的业务. 属性是解决许多与产品相关的实际任务的有力方法. 这是一个相当广泛的话题,但在这个视频中,我们将讨论添加一个下拉类型属性到 ...

  10. Swift数据类型_整型和浮点型

    //swift中的整型和浮点型 /** * //类型推断整数是Int 浮点数是Double ,日常使用需要注意不能越界,存储时间毫秒数 英雄经验数等等之类内容容易越界 整型 大多数情况下,你不需要在代 ...