2011-02-11 2 views
0

Я хочу изменить ширину элемента, чтобы сделать простую анимацию вот код:Крошка вопрос о закрытии JavaScript

function mysildeDown(elem) { 
    var fullw = parseInt(getStyle(elem, 'width')); 

    elem.style['width'] = 0; 

    for (var j=0; j < 100; j++) { 
     (function() { 
      **var i=j;** 
      setTimeout(function() { 
       elem.style['width'] = (i/100) * fullw + 'px'; 
      }, (i + 1) * 10); 
     })(); 
    } 
} 

// функция GetStyle не проблема
Интересно, почему я должен use var i = j, Большое спасибо

+0

Увольнение 100 тайм-аутов - это не оптимальный способ сделать анимацию. Вы можете использовать рекурсию таймаута: начальный тайм-аут вызывает больше тайм-аутов до достижения цели анимации. –

+0

Я чувствую, что вы читаете книгу Джона Ресига «Pro JavaScript Techniques». – qwertymk

ответ

2

Обычно, когда вы выполняете что-то подобное внутри цикла и используете значение j в другой функции, функция всегда заканчивается последним значением j. Итак, вам нужно найти способ использования значения j, как это было, когда вы создали эту функцию внутри цикла.

Как я обычно вижу, это передать его в качестве параметра в сразу вызываемой функции, как показано ниже.

function mysildeDown(elem){ 
    var fullw=parseInt(getStyle(elem,'width')); 

    elem.style['width']=0; 
    for(var j=0;j<100;j++){ 
    (function(i){ 
     setTimeout(function(){ 
     elem.style['width']= (i/100)*fullw+'px'; 
     },(i+1)*10) 
    })(j); 
    } 
} 
+0

Не должно быть необходимости передавать его в вашу анонимную функцию. j будет в объеме. – Endophage

+0

есть ли недостаток, чтобы передать его, в отличие от установки переменной i в функции, как это делал Ланстон? Просто любопытно. – Jeff

+0

@ Эндофаг, вам не хватает смысла. Функции тайм-аута будут привязаны к переменной 'i', значение которой в конечном итоге будет последним значением' j' (99). Вам нужно привязать разные значения к каждой функции тайм-аута, чтобы достичь желаемой анимации. –

0

используя ключевое слово var при определении переменной в javascript объявляет ее в рамках текущей строки кода. В вашем конкретном случае, если вы не использовали ключевое слово var при объявлении переменной i, тогда i был бы глобальным, потенциально вызывающим проблемы, поскольку он так часто используется в циклах for.

С помощью ключевого слова var внутри функции ваша переменная i является локальной функцией и недоступна вне области действия этой функции.

Есть некоторая хорошая информация here.

0

Так, чтобы в момент времени, когда был вызван setTimeout, я получил значение j в функции таймера. По сути, вы сохраняете значение j, которое должно использоваться при срабатывании таймера.

Смежные вопросы