0

这种方式不起作用（元素是从函数中拉入的）。

    function styleTwitter1( pair_array )
    {
        var i;
        var input;
        var label;
        var font_size;

        for ( i = 0; i < pair_array.length; i+=2 ) 
        {
/*
*/
            input = document.getElementById( pair_array[ i ] );
            label = document.getElementById( pair_array[ i + 1 ] );
/*
*/
            label.fontSize = window.getComputedStyle( label, null ).getPropertyValue("font-size");
/*
*/
            input.addEventListener( "keypress", function()
            { 
                label.style.opacity = 0; 
            }, false );
/*
*/
            input.addEventListener( "focus", function()
            { 
                if( input.value === '' )
                {
                    label.style.opacity = 0.2; 
                    input.style.border = '1px solid #888888'; 
                }
            } , false );
/*
*/
            input.addEventListener( "blur", function()
            {
                if( input.value === '' )
                {
                    label.style.opacity = 1;
                    new EffectsFont( label ).fade( 'up', 150 );
                    input.style.border = '1px solid #dddddd'; 
                }   
            } , false );
/*
*/
        }
    }

但是，这种方式可以（元素是从函数外部注入的）。

    function initTwitterStyle( input, label )
    {
/*
*/
        input.addEventListener( "keypress", function()
        { 
            label.style.opacity = 0; 
        }, false );
/*
*/
        input.addEventListener( "focus", function()
        { 
            if( input.value === '' )
            {
                label.style.opacity = 0.2; 
                input.style.border = '1px solid #888888'; 
            }
        }, false );
/*
*/
        input.addEventListener( "blur", function()
        {
            if( input.value === '' )
            {
                label.style.opacity = 1;
                new EffectsFont( label ).fade( 'up', 150 );
                input.style.border = '1px solid #dddddd'; 
            }

        }, false );
/*
*/
    }

如果我无法弄清楚差异，我最终会做的是将我的数组循环拉到外面，然后将元素注入 twitterStyle2。

目前，我无法获得错误代码，但只有一对正在初始化..然后 EffectsFont 不起作用。

Jshint 警告不要在循环中创建函数，但我不明白为什么？问题是什么？

4

2 回答 2

2

你有一个关闭问题。处理程序对变量进行闭包label。但是，当循环完成时，label将是最后一个元素 - 所有处理程序label在触发时都将视为最后一个元素。

于 2012-05-19T23:04:40.173 回答
0

我称之为冻结闭包变量，基本上是通过使用一个自调用函数来创建一个不共享的新闭包。

var divs = [...];
for (var i=0; i < 10; i++) {
  // Here's the self calling function
  div.onclick = (function(i){
    return function() {
      console.log("Clicked div with index" + i);
    }
  })(i);// Passing the variable to the self calling function creating a new closure 
}

但是，我的首选方法是使用https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind

var divs = [...];
for (var i=0; i < 10; i++) {
  div.onclick = (function(i) {
      console.log("Clicked div with index" + i + "and id" + this.id );
    }
  }).bind(div, i);
}
于 2012-05-19T23:10:09.980 回答