[jQuery] 使用 one() 來設定單次的事件函式

[jQuery] 使用 one() 來設定單次的事件函式

今天在改一個 web app 時,遇到了奇怪的問題…

在某個按鈕被按下後,就會執行下面的程式片段,

預期待會顯示出來的對話框 (dialog) 消失之後,會執行一次 jsLoginAccountFinish():

$("#modalDialog").on("hide.bs.modal", function() {
jsLoginAccountFinish(iAccount, param);
});

 

但是測試時,在第一次按鈕時 jsLoginAccountFinish() 被呼叫了一次,

第二次按鈕時卻被呼叫了兩次,不曉得是怎麼回事…

 

看了半天,從程式原始碼看不出什麼問題,

但終於猜測到是不是事件函式造成的問題~ 

問題就在於第一次按下按鈕時,會執行一次 .on() 增加「一個」hide.bs.modal 的事件函式,

在第二次按下按鈕時,又會再執行一次 .on(),又增加了「一個」hide.bs.modal 的事件函式,

導致現在有兩個 hide.bs.modal 事件函式,

因此這個事件函式在對話框被關掉時,就會被執行兩次…

 

要解決的方法也很簡單,一種是在 .on() 之前先用 .off() 清除掉,

或者是很確定這個事件函式最多只能被觸發一次的話,可以改用 .one(),例如:

$("#modalDialog").one("hide.bs.modal", function() {
jsLoginAccountFinish(iAccount, param);
});

 

參考資料:jQuery .one() function

 

(本頁面已被瀏覽過 147 次)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料