的javascript：變量局部塊

我試着去理解在Javascript中的變量範圍。下面是我在做什麼：的javascript：變量局部塊

<script> 
for (var i = 0; i < 3; i++) { 
    document.getElementById(i).onclick = function() { 
    console.log(i); 
    } 
} 
</script>

的輸出總是3，我的理解是因爲i一直保留引用。如何本地化i，以便記錄遞增的值？

謝謝！

更新

謝謝你們快速和體面的反應。解決方案確實有幫助！

起初，我想類似的方法來@GrailsGuy，那就是：

<script> 
for (var i = 1; i <= 3; i++) { 
    document.getElementById(i).onclick = function() { 
     console.log(logCall(i)); 
    } 
} 
function logCall(i) { 
    return i; 
} 
</script>

但它看起來像i沒有被本地化。無法弄清楚爲什麼！

來源

2013-07-06 Michael

它有什麼做的onclick事件？如果用戶只點擊一次，它如何通過onclick循環？你需要logCall（）函數嗎？那不會和console.log（i）一樣嗎？ – oobie11

關於你的編輯，它和第一個例子中的問題是一樣的。無論你是否有'的console.log（I）'或'superlongandconfusingfunctionname（我）'的事件處理中不會有所作爲。循環終止後，您正試圖訪問'i'。 –

創建一個新的範圍

for (var i = 0; i < 3; i++) { 
    (function(i) { 
    document.getElementById(i).onclick = function() { 
     console.log(i); 
    } 
    }(i)); 
}

來源

2013-07-06 14:58:19 Prinzhorn

在Javascript中，不是由括號（違背類似C的語法）創建的範圍。範圍然而，在函數創建的，所以一個方法是將呼叫提取到一個函數（更新）：

<script> 
for (var i = 0; i < 3; i++) { 
    logCall(i); 
} 

function logCall(i) { 
    document.getElementById(i).onclick = function() { 
     console.log(i); 
    } 
} 
</script>

這樣做使得代碼略偏可重複使用的好處。

來源

2013-07-06 14:56:45 Igor

爲什麼downvote？ – Igor

我沒有downvote，但你的代碼沒有解決任何問題。 – Prinzhorn

這是不正確，http://jsfiddle.net/GaCPv/ – Musa

的javascript：變量局部塊

回答

相關問題