<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>for與onclick配合</title>
<script type="text/javascript">
window.onload=function(){
var btn=document.getElementsByTagName("input");
for(var i=0;i<btn.length;i++){
btn[i].onclick=function(){
alert(this.value);
}
}
}
</script>
</head>
<body>
<input type="button" value="for循環"/>
<input type="button" value="事件處理"/>
<input type="button" value="彈窗顯示"/>
</body>
</html>
這段程序在點擊了相應的按鈕後會顯示相應的value值。
但是為什麼把alert裡改成i後,不管點哪個都顯示3,而不是對應的0,1,2呢?
既然i值都是3,那是怎麼能正常顯示出對應的value的。
this就是當前的button對象,直接alert i只能得到for循環後的,要做閉包指向當前執行到的i值
window.onload = function () {
var btn = document.getElementsByTagName("input");
for (var i = 0; i < btn.length; i++) {
btn[i].onclick = (function (i) {
return function () { alert(this.value+"|"+i); }
})(i);
}
}