欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序事件對象中e.target和e.currentTarget的區(qū)別詳解

 更新時間:2019年05月08日 09:54:31   作者:大表哥  
這篇文章主要介紹了微信小程序事件對象中e.target和e.currentTarget的區(qū)別詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧

在小程序的事件回調(diào)觸發(fā)時,會接收一個事件對象,事件對象的參數(shù)中包含一個target和currentTarget屬性,接下來說說這二者的區(qū)別。

首先上代碼:

wxml部分:

<view id='tar-father' bindtap='click'>
  父組件
  <view id='tar-children'>子組件</view>
 </view>

wxss部分:

#tar-father{
 width: 300rpx;
 height: 300rpx;
 background-color: skyblue;
}
#tar-children{
 background-color: pink;
}

效果圖

js部分:

 click: function (event) {
  console.log(event.target)
  console.log(event.currentTarget)
 }

當(dāng)點擊圖中粉色子組件區(qū)域時的輸出結(jié)果:

event.target 為其子組件,也就是觸發(fā)該事件的源頭組件

event.currentTarget 為事件所綁定的組件

當(dāng)點擊圖中藍(lán)色父組件區(qū)域時的輸出結(jié)果:

event.target 為父組件,因為觸發(fā)的源頭也就是父組件本身

event.currentTarget 始終為事件所綁定的組件

總結(jié):target對應(yīng)的是觸發(fā)事件的源頭組件,這個組件有可能是子組件,有可能是父組件,主要是看執(zhí)行動作的區(qū)域。而currentTarget始終對應(yīng)事件所綁定的組件。

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

  • js 動態(tài)添加標(biāo)簽(新增一行,其實很簡單,就是幾個函數(shù)的應(yīng)用)

    js 動態(tài)添加標(biāo)簽(新增一行,其實很簡單,就是幾個函數(shù)的應(yīng)用)

    把所有代碼拷下另存為一個html文件,在瀏覽器中打開,點擊“新增一行”按鈕就可以,以下是對js函數(shù)的解釋
    2009-03-03
  • 微信小程序+ECharts實現(xiàn)動態(tài)刷新的過程記錄

    微信小程序+ECharts實現(xiàn)動態(tài)刷新的過程記錄

    這篇文章主要給大家介紹了關(guān)于微信小程序+ECharts實現(xiàn)動態(tài)刷新的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2021-05-05
  • JavaScript生成福利彩票雙色球號碼

    JavaScript生成福利彩票雙色球號碼

    無聊用javascript寫了個隨機(jī)產(chǎn)生福利彩票雙色球7個數(shù)字的號碼其中紅色球不會重復(fù),喜歡的可以下來看看,有意見的可以說說
    2015-05-05
  • 微信小程序 簡易計算器實現(xiàn)代碼實例

    微信小程序 簡易計算器實現(xiàn)代碼實例

    這篇文章主要介紹了微信小程序 簡易計算器實現(xiàn)代碼實例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
    2019-09-09
  • js事件觸發(fā)操作實例分析

    js事件觸發(fā)操作實例分析

    這篇文章主要介紹了js事件觸發(fā)操作,結(jié)合實例形式分析了javascript事件觸發(fā)機(jī)制原理、使用方法及相關(guān)操作注意事項,需要的朋友可以參考下
    2019-06-06
  • TypeScript接口和類型的區(qū)別小結(jié)

    TypeScript接口和類型的區(qū)別小結(jié)

    在 TypeScript 中,有兩種主要的定義自定義類型的方式,接口和類型,盡管它們在外觀上可能相似,但它們之間有一些關(guān)鍵的區(qū)別,本文就詳細(xì)的介紹一下,感興趣的可以了解下
    2023-05-05
  • 有趣的bootstrap走動進(jìn)度條

    有趣的bootstrap走動進(jìn)度條

    這篇文章主要為大家詳細(xì)介紹了如何實現(xiàn)有趣的bootstrap走動進(jìn)度條,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-12-12
  • JavaScript利用img實現(xiàn)前端頁面埋點功能

    JavaScript利用img實現(xiàn)前端頁面埋點功能

    做數(shù)據(jù)分析的時候需要獲取足量的有效數(shù)據(jù),這個時候就需要我們在前端頁面埋點。如何來實現(xiàn)一個前端埋點功能,本文就帶你上手試試
    2022-06-06
  • 淺談原生JS中的延遲腳本和異步腳本

    淺談原生JS中的延遲腳本和異步腳本

    下面小編就為大家?guī)硪黄獪\談原生JS中的延遲腳本和異步腳本。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-07-07
  • JavaScript之WebSocket技術(shù)詳解

    JavaScript之WebSocket技術(shù)詳解

    這篇文章主要為大家詳細(xì)介紹了JavaScript之WebSocket技術(shù),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-11-11

最新評論