2013-06-10 3 views
0

Учитывая следующий JavaScript:Javascript OnFocus и ONBLUR закрытия не работает, как ожидалось

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 
function runMe(){ 
for(var x=0; x<5; x++){ 
    var d=document.createElement("DIV"); 
    d.innerHTML="test " + x; 
    d.tabIndex=x; 

    d.onfocus=function(y){ 
    return function(){ 
    alert("focus: " + y); 
    } 
    }(x); 

    d.onblur=function(y){ 
    return function(){ 
    alert("blur: " + y); 
    } 
    }(x); 

    document.body.appendChild(d); 

} 
} 
</script> 
</head> 
<body onload="runMe()"> 
</body> 
</html> 

При запуске, пожары ONBLUR событий и предупреждает индекс вновь сосредоточенного DIV, а не предупреждая индекс ранее -фокусированный div.

Как ни странно, когда я отмечаю событие onfocus, onblur работает так, как ожидалось, предупреждая ранее сконцентрированный div.

Я не могу понять, почему событие onblur запускает тот же индекс, что и событие onfocus.

Я считаю, что мои замыкания верны, но я не на это 100%.

У кого-нибудь есть представление о моей ошибке?

ответ

1

DEMO: http://jsfiddle.net/abc123/nCwDz/1/

Ваш код, кажется, работает для меня ... изменил предупреждение для console.log, пожалуйста, используйте Firefox или Chrome, а затем перейти в консоль, чтобы увидеть его работы.

Чтобы подтвердить правильность ваших замыканий, я изменил ваш код, чтобы его отступ соответствовал.

КОД:

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript"> 
      function runMe(){ 
       for(var x=0; x<5; x++){ 
        var d=document.createElement("DIV"); 
        d.innerHTML="test " + x; 
        d.tabIndex=x; 

        d.onfocus=function(y){ 
         return function(){ 
          console.log("focus: " + y); 
         } 
        }(x); 

        d.onblur=function(y){ 
         return function(){ 
          console.log("blur: " + y); 
         } 
        }(x); 

        document.body.appendChild(d); 
       } 
      } 
     </script> 
    </head> 
    <body onload="runMe()"> 
    </body> 
</html> 
+0

Попробуйте использовать предупреждение, они появляются слишком много раз! –

+1

@ abc123, Yup, вы абсолютно правы - всплывающее диалоговое окно фактически вызывало неожиданное размытие. Я проверю вас как ответ через 4 минуты ;-) СПАСИБО! – alfadog67