首頁(yè) 猿問(wèn) 使用jq框架，如何讓事件在捕獲階段執(zhí)行。

使用jq框架，如何讓事件在捕獲階段執(zhí)行。

JavaScript

千巷貓影 2018-09-24 20:15:02

比如在父元素A設(shè)置一個(gè)事件，在子元素B設(shè)置另一個(gè)事件。點(diǎn)擊子元素的時(shí)候，我希望A的事件先觸發(fā)（就是按照捕獲階段執(zhí)行）但是我看過(guò)源碼，jq綁定事件的addEventlistener只能冒泡執(zhí)行。這令我不解，難道jq沒(méi)有給出解決方法嗎？這種情況應(yīng)該有人遇到過(guò)才對(duì)，是怎么解決的呢？$(box).on('click',function(e){console.log(0)}); //并不是最先觸發(fā)的$(b1).on('click',function(e){console.log(1)}); $(box).on('click.blur','.b1',function(e){console.log(2)});

查看完整描述

1 回答

臨摹微笑

TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊

看來(lái)是jq本身沒(méi)有打算為事件控制捕獲順序了。
那么我試著假設(shè)要為jq框架的基礎(chǔ)上添加一個(gè)這樣的功能，修改原先的程序。
首先為綁定事件（event.add）增加一個(gè)可選參數(shù)capture，用于決定捕獲順序。
正常來(lái)說(shuō)jq只會(huì)為一個(gè)元素綁定一個(gè)addEventListener。但為了能按照捕獲順序觸發(fā)函數(shù)，接收到有capture的事件，需額外綁定一個(gè)capture為true的addEventListener。
為jq事件處理對(duì)象（handlers）加上capture屬性。
然后修改event.handlers方法，按照事件傳播階段（eventPhase）來(lái)判斷現(xiàn)在觸發(fā)的是捕獲還是冒泡觸發(fā)。如果是捕獲觸發(fā)，在處理程序列表（handlerQueue）內(nèi)插入capture為true的handlers。然后就能按照正常流程執(zhí)行處理程序。
以上的修改能保留原先的構(gòu)造上增加捕獲觸發(fā)的功能，也能使用jq.off(解除綁定事件)。希望以后jq能增加這個(gè)功能吧。