微信小程式 阻止冒泡事件

2022-03-07 12:36:13 字數 1269 閱讀 9556

bindtap,當使用者點選該元件的時候會在該頁面對應的page中找到相應的事件處理函式。

<

view

id="taptest"

data-hi

="wechat"

bindtap

="tapname"

> click me!

view

>

page(

})

事件繫結的寫法同元件的屬性,以 key、value 的形式。

bind事件繫結不會阻止冒泡事件向上冒泡,catch事件繫結可以阻止冒泡事件向上冒泡。

如在下邊這個例子中,點選廣州市會先後呼叫handletap3handletap2(因為tap事件會冒泡到 廣東省,而 廣東省 阻止了 tap 事件冒泡,不再向父節點中國傳遞),點選 廣東省 會觸發handletap2,點選中國 會觸發handletap1

<

view

id="outer"

bindtap

="handletap1"

>

中國

<

view

id="middle"

catchtap

="handletap2"

>

廣東省

<

view

id="inner"

bindtap

="handletap3"

>

廣州市

view

>

view

>

view

>

在從.js**中寫入

//js

page(,

handletap2:

function

(event) ,

handletap3:

function

(event)

})

從控制台我們可以看到結果如下:

以此,大家以後就可以正確使用好事件去完成你的功能了。

菜鳥初到,如有問題希望可以指出。

微信小程式 冒泡事件及其阻止

事件的類別分為幾種 點選事件 tap 長按事件 longtap 觸控事件 touchstart touchend touchcancel touchmove 其他 input submit.其中前三類是冒泡事件,其他的稱為非冒泡事件。寫乙個簡單的例子,就不一一貼出來了,wxml的檔案如下 view ...

微信小程式 事件

事件繫結 事件繫結的寫法同元件的屬性,以 key value 的形式。key 以bind或catch開頭,然後跟上事件的型別,如bindtap,catchtouchstart value 是乙個字串,需要在對應的 page 中定義同名的函式。不然當觸發事件的時候會報錯。bind事件繫結不會阻止冒泡事...

微信小程式事件小結

1 事件繫結bindtap 如上,給增加了乙個golink的方法,那如何獲取事件的入參?先將需要傳遞的引數通過data 形式寫在元素上,上面 golink 要傳遞linkeurl,直接在image元素上新增data linke url直接看golink方法 開啟url鏈結 golink functi...