IE не соблюдает последовательность выполнения строки javascript?

#javascript #jquery #internet-explorer

Вопрос:

Я пытаюсь анимировать с помощью jQuery, но в IE7 / 8 / 9 он не работает до того, как я покажу элемент.

 function callback() {
    $('#content').animate([...]);
    [...]
}

$('#content').hide();
[...]
$('#content').show();
callback();

Это работает только для меня, когда я делаю setTimeout(function() { callback(); }, 300); , возможно, мне нужно подождать, пока IE распознает показанный элемент, прежде чем выполнять обратный вызов. В чем здесь проблема?

Ответ №1:

Вам нужно дождаться, пока элемент будет существовать на странице, прежде чем вы сможете выбрать его с помощью jQuery.

завершите свой скрипт с помощью:

 jQuery(function($){
  //your code here
});

Это ярлык для прослушивателя document.ready событий.

Ответ №2:

Поскольку JS является однопоточным, то то, что вы вызываете show(), не означает, что он действительно отображается; вам нужно вернуть управление родительскому элементу, чтобы он мог рисовать и обновлять DOM, прежде чем это произойдет. setTimeout позволяет вашему JS уступать родительскому, обновляя его, прежде чем вы продолжите выполнение. setTimeout с 0, скорее всего, также будет работать.

1. Это несколько вводит в заблуждение. Хотя верно, что выполнение чего-либо в жестком цикле и отсутствие результатов обычно не позволяют перерисовывать страницу, это не означает, что вам нужно дать DOM для «обновления». Любая функция управления DOM не вернется, пока браузер полностью не обновит свои внутренние структуры данных; следующий оператор сценария увидит, что DOM обновлен внутри , даже если эти изменения еще не были отображены на экране. Таким образом, вызов hide и show последовательно без получения результата не приведет к видимому результату, но он будет логически последовательным.

2. Он говорит о том, что анимация не работает без setTimeout, и я полагаю, что именно поэтому. В данном контексте я не думаю, что мой ответ вводит в заблуждение — я не упоминаю об этом, потому что это не показалось уместным, поскольку скрыть / показать не там, где его проблема.

3. Если мы сначала .hide() вызываем элемент, вызываем .show() , а затем вызываем .animate(...) , просто не имеет значения , выдает ли скрипт результат между вызовом show и animate .