JavaScript在for循環(huán)中綁定事件解決事件參數(shù)不同的情況

更新時間：2014年01月20日 17:02:15 作者：

響應(yīng)一堆相似的事件，但是每個事件的參數(shù)都不同，在這種情況下就可以使用JavaScript 在for循環(huán)中綁定事件，下面有個不錯的示例，大家可以參考下

有時候要對響應(yīng)一堆相似的事件，但是每個事件的參數(shù)都不同，一開始還以為挺簡單的，用個for循環(huán)不就得了，結(jié)果發(fā)現(xiàn)，額，都是使用了最后一個參數(shù)。。。

上網(wǎng)查資料！??！結(jié)果大神說用閉包解決

代碼：

復(fù)制代碼代碼如下:

 
for(var i=0;i<10;i++){ 
btns[i].onclick=(function(i){ 
return function(){alert(i)} 
})(i) 
} 

大概原因是直接用btns[i].onclick=function(){alert(i)}時，JavaScript引擎會先將for循環(huán)里的代碼執(zhí)行完，

當(dāng)用戶出發(fā)onclick事件時，JavaScript會尋找i，結(jié)果會找到運(yùn)算完成之后的i，也就是10

但是用閉包處理的話，i會成為函數(shù)的局部變量

您可能感興趣的文章:

相關(guān)文章

javascript創(chuàng)建動態(tài)表單的方法
這篇文章主要介紹了javascript創(chuàng)建動態(tài)表單的方法,實(shí)例分析了javascript動態(tài)操作頁面表單元素的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-07-07
JavaScript中String對象的使用方法以及實(shí)例
這篇文章主要給大家介紹了關(guān)于JavaScript中String對象的使用方法以及實(shí)例的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),方便開發(fā)者在JavaScript開發(fā)中更好地處理字符串,需要的朋友可以參考下
2022-04-04
ES6中的箭頭函數(shù)實(shí)例詳解
這篇文章主要介紹了ES6中的箭頭函數(shù),結(jié)合實(shí)例形式詳細(xì)分析了ES6中箭頭函數(shù)的基本語法、特性、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下
2017-04-04
微信小程序?qū)崿F(xiàn)上傳視頻功能
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)上傳視頻功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-08-08
JavaScript實(shí)現(xiàn)音樂播放器
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)音樂播放器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-08-08
xss文件頁面內(nèi)容讀取(解決)
xss文件頁面內(nèi)容讀取(解決),需要的朋友可以參考下。
2010-11-11
微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動畫
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動畫，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-06-06
JavaScript實(shí)現(xiàn)公告欄上下滾動效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)公告欄上下滾動效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-03-03
javascript中的數(shù)據(jù)類型檢測方法詳解
這篇文章主要介紹了javascript中的數(shù)據(jù)類型檢測方法,結(jié)合實(shí)例形式分析了javascript數(shù)據(jù)類型并總結(jié)分析了常見的數(shù)據(jù)類型檢測操作技巧,需要的朋友可以參考下
2019-08-08
js控制頁面的全屏展示和退出全屏顯示的方法
這篇文章主要介紹了js控制頁面的全屏展示和退出全屏顯示的方法,實(shí)例分析了javascript控制頁面全屏效果的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-03-03