Javascript :: this.value在for循環中無法正常工作？

Question

我的代碼幾乎可以說明我即將實現的內容，但只是爲了澄清...

我想在長按（mousedown爲200ms）後返回輸入值。

它在for循環外完美工作，但在循環內部看起來好像不是。

對於this.value它返回undefined並且對於gangina[i].value它不返回任何內容。

這裏是的jsfiddle：

http://jsfiddle.net/hezi_gangina/nxao19oc/

這裏是我的代碼：

<input type=button value=1> 
<input type=button value=2> 

<script> 

var hezi; 
var gangina=document.getElementsByTagName("input"); 

alert(gangina[1].value); //THIS IS OK! :) 

for(i=0;i<gangina.length;i++) 
{ 

    gangina[i].onmousedown=function() 
    { 
     hezi=setTimeout 
     (
      function() 
      { 
       alert('this = '+this.value); // = undefined 
       alert('gangina['+i+'] = '+gangina[i].value); // = nothing 
      },200 
     ); 
    } 

} 

</script> 

這裏需要小的調整...

Answer 1

DEMO

您可能需要將IIFE中的函數封裝起來，這會綁定i值。

由於內部mousedown事件處理程序將在某個時間點執行，因此它將只記住最後一個值i。另外請注意，您忘記提及我的盈方var。

如果您想分配正確的值i，那麼最好將內部函數包裝在IIFE函數中，現在事件處理程序將在此時引用本地作用域i。所以它會永遠記住i的正確值。

for(var i=0;i<gangina.length;i++) 
{ 
    (function(i) { 
    gangina[i].onmousedown=function() 
    { 
     var that = this; 
     hezi=setTimeout 
     (
      function() 
      { 
       alert('this = '+that.value); // = undefined 
       alert('gangina['+i+'] = '+gangina[i].value); // = nothing 
      },200 
     ); 
    } 
    })(i); 

} 

另外，setTimeout內，this將指Window對象不是DOM元素。