首頁 > web前端 > js教程 > 為什麼我的事件處理程序從動態建立的元素中的最後一個循環迭代接收值?

為什麼我的事件處理程序從動態建立的元素中的最後一個循環迭代接收值?

Linda Hamilton
發布: 2024-11-06 14:45:02
原創
1082 人瀏覽過

Why are my event handlers receiving values from the last loop iteration in dynamically created elements?

事件處理程序和閉包中的變數參考

在此場景中,您將在循環中使用事件處理程序動態建立元素。最初,目的是根據循環迭代將不同的值傳遞給事件處理程序。但是,事件處理程序似乎正在接收來自上次循環迭代的值,這表明存在範圍問題。

事實上,程式碼的問題在於在迴圈中使用匿名函數作為事件處理程序。正如您所懷疑的那樣,事件處理函數是引用循環內變數的閉包。當事件觸發時,循環已完成,引用的變數會保存上次迭代中分配的最終值。

實作閉包

解決此問題問題並將預期值正確傳遞給事件處理程序,您需要實作一個在循環執行時捕獲變數的閉包。透過這樣做,每個事件處理程序將擁有對其所需的特定值的自己的參考。

以下修改後的程式碼透過將事件處理程序函數包裝在另一個立即呼叫的匿名函數(也稱為IIFE,即立即呼叫函數表達式):

在在此修改後的程式碼中,內部IIFE 會傳回實際的事件處理函數,同時接收傳入的必要參數(select、callid、anotherid)從循環中。透過在循環執行時捕獲這些值,您可以有效地為每個事件處理程序建立一個單獨的作用域。

此技術可確保每個事件處理程序在事件發生時都有自己對所需值的引用,從而解決值引用不當的問題。

以上是為什麼我的事件處理程序從動態建立的元素中的最後一個循環迭代接收值?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板