简单了解微信小程序 e.target与e.currentTarget的不同
更新时间：2019年09月27日 15:29:57 作者：不睡
这篇文章主要介绍了微信小程序 e.target与e.currentTarget的区别详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
在小程序的点击事件中，我们经常使用这两个属性来传参，看起来效果一样，查了官方文档如下：
target：事件源组件对象
currentTarget：当前组件对象
什么意思？我刚开始就有点不懂，那就直接上代码：
<view id="outter" bindtap="tap1">
outer view
<view id="middle" bindtap="tap2">
middle view
<view id="inner" bindtap="tap3">
inner view
</view>
</view>
</view>
tap1: function (e) {
console.log(1, e)
},
tap2: function (e) {
console.log(2, e)
},
tap3: function (e) {
console.log(3, e)
},
结果如下:
点击子元素inner，但由于事件冒泡父元素middle和outter都触发，从上图中我们可以看出区别：
父元素middle和outter，target的id都是等于inner(子元素的id)；
middle的currentTarget的id是middle，outter的currentTarget的id是outter；
总结：
target：事件源组件对象(事件冒泡源头)
currentTarget：当前组件对象(就是当前对象)
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
Ajax（Asynchronous Javascript And XML），即是异步的JavaScript和XML，Ajax其实就是浏览器与服务器之间的一种异步通信方式2022-10-10
这篇文章主要介绍了详解Webpack如何引入CDN链接来优化编译后的体积，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-06-06
JS是一门面向对象语言,其对象是用prototype属性来模拟的，本文介绍了如何封装JS对象，具有一定的参考价值，下面跟着小编一起来看下吧2016-12-12
这篇文章主要介绍了js Calender控件使用详解,需要的朋友可以参考下2015-01-01
下面小编就为大家带来一篇浅谈js的异步执行。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-10-10
本篇文章主要介绍了Javascript中字符串相关常用的使用方法。具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
本文介绍了如何在网页中实现一个动态显示的时钟,并且添加了白天和夜晚两种模式的切换功能,通过简单的HTML结构和JavaScript代码,使用Date()函数动态获取当前的时间,并将时、分、秒通过逻辑绑定到相应的div元素上,实现时钟的动态显示,需要的朋友可以参考下2024-09-09
本文主要介绍了js实现旋转木马效果的实例。具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
input+select(multiple) 实现下拉框输入值
昨天做一个网站时，需要实现下拉框能够输入，从功能上讲是要实现用户在文本框输入值时，能够从后读出数据弹出下拉选项2009-05-05
在函数式编程中，函数被看做是“一等公民”。JavaScript可以通过巧妙地函数组合来构建抽象，通过内嵌函数的方式，在软件开发的过程中，我们可以把更多的精力放在“函数要做什么”上，而不用太关心“函数如何做”的问题。2015-10-10
最新评论