簡單了解微信小程序 e.target與e.currentTarget的不同
更新時間：2019年09月27日 15:29:57 作者：不睡
這篇文章主要介紹了微信小程序 e.target與e.currentTarget的區(qū)別詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
在小程序的點擊事件中，我們經(jīng)常使用這兩個屬性來傳參，看起來效果一樣，查了官方文檔如下：
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)
},
結(jié)果如下:
點擊子元素inner，但由于事件冒泡父元素middle和outter都觸發(fā)，從上圖中我們可以看出區(qū)別：
父元素middle和outter，target的id都是等于inner(子元素的id)；
middle的currentTarget的id是middle，outter的currentTarget的id是outter；
總結(jié)：
target：事件源組件對象(事件冒泡源頭)
currentTarget：當前組件對象(就是當前對象)
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript前后端數(shù)據(jù)交互工具ajax使用教程
Ajax（Asynchronous?Javascript?And?XML），即是異步的JavaScript和XML，Ajax其實就是瀏覽器與服務器之間的一種異步通信方式2022-10-10
詳解Webpack如何引入CDN鏈接來優(yōu)化編譯后的體積
這篇文章主要介紹了詳解Webpack如何引入CDN鏈接來優(yōu)化編譯后的體積，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-06-06
JS是一門面向?qū)ο笳Z言,其對象是用prototype屬性來模擬的，本文介紹了如何封裝JS對象，具有一定的參考價值，下面跟著小編一起來看下吧2016-12-12
這篇文章主要介紹了js Calender控件使用詳解,需要的朋友可以參考下2015-01-01
下面小編就為大家?guī)硪黄獪\談js的異步執(zhí)行。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
Javascript中字符串相關(guān)常用的使用方法總結(jié)
本篇文章主要介紹了Javascript中字符串相關(guān)常用的使用方法。具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
本文介紹了如何在網(wǎng)頁中實現(xiàn)一個動態(tài)顯示的時鐘,并且添加了白天和夜晚兩種模式的切換功能,通過簡單的HTML結(jié)構(gòu)和JavaScript代碼,使用Date()函數(shù)動態(tài)獲取當前的時間,并將時、分、秒通過邏輯綁定到相應的div元素上,實現(xiàn)時鐘的動態(tài)顯示,需要的朋友可以參考下2024-09-09
本文主要介紹了js實現(xiàn)旋轉(zhuǎn)木馬效果的實例。具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
input+select(multiple) 實現(xiàn)下拉框輸入值
昨天做一個網(wǎng)站時，需要實現(xiàn)下拉框能夠輸入，從功能上講是要實現(xiàn)用戶在文本框輸入值時，能夠從后讀出數(shù)據(jù)彈出下拉選項2009-05-05
在函數(shù)式編程中，函數(shù)被看做是“一等公民”。JavaScript可以通過巧妙地函數(shù)組合來構(gòu)建抽象，通過內(nèi)嵌函數(shù)的方式，在軟件開發(fā)的過程中，我們可以把更多的精力放在“函數(shù)要做什么”上，而不用太關(guān)心“函數(shù)如何做”的問題。2015-10-10