JavaScript

超轻量级php框架startmvc

vue如何获取点击事件源的方法

更新时间:2020-05-29 01:06 作者:startmvc
整理文档,搜刮出一个vue如何获取点击事件源的方法,稍微整理精简一下做下分享。<!DOCT

整理文档,搜刮出一个vue如何获取点击事件源的方法,稍微整理精简一下做下分享。


<!DOCTYPE html>
<html lang="zh-CN">
 <head>
 <meta charset="utf-8">
 <title>vue click事件获取当前元素对象</title>
 <script src="http://cdnjs.cloudflare.com/ajax/libs/vue/1.0.13/vue.min.js"></script>
 <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
 </head>
 <body id="app">
 <ul>
 <li v-on:click="say('hello!', $event)" style="background-color:blue;color:white;">点击当前行获取下一行</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;
 var li2text = $(el).next().text();
 alert("当前对象的内容:"+$(el).text()+" 下一行内容:"+li2text);
 }
 }
 })
 </script>
 </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。