Загрузка окна внутри документа готова?

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

Просто, $(window).load.(function() {}) можно использовать INSIDE для $(document).ready.(function() {})?

У меня есть некоторые вещи, которые нужно сделать после загрузки DOM, но затем я хочу показать некоторые элементы только после того, как изображения закончили загрузку. Единственное, что работает в Explorer 8, заключается в том, чтобы поместить функции $(window).load внутри $(document).ready со всем остальным.

Это приемлемая практика?

Я просто хочу использовать наиболее приемлемый метод, чтобы показать DIV, который содержит маленькие изображения, например панель инструментов, после полной сборки. (visibility hidden по сравнению с display none, например). HTML для этого DIV записывается кодом внутри $(document).ready, а затем добавляется к телу с помощью $('body').append() перед использованием $(window).load.

У меня много проблем с Explorer 8.

Ответы

Ответ 1

Это прекрасно работает и является приемлемой практикой. В конце концов, как вы описали, могут быть случаи, когда логика в обработчике $(window).load() зависит от работы, выполняемой после готовности DOM. Если окно уже загружено к моменту настройки $(window).load(), обработчик сразу же запустится немедленно.

Ответ 2

EDIT:

ПРИМЕЧАНИЕ. Этот ответ применим только к jQuery v2 и ниже.

jQuery .ready() событие:

Обработчик, переданный в .ready(), гарантирован, будет выполнен после того, как DOM готов, поэтому это, как правило, лучшее место для присоединения всех других обработчиков событий и запуска другого кода jQuery.

jQuery .load() метод событий:

Событие load отправляется элементу , когда он и все подэлементы имеют была полностью загружена. Это событие может быть отправлено на любой элемент связанные с URL: изображениями, сценариями, фреймами, iframe и оконный объект.

На основе вышеперечисленной документации jQuery я ничего не видел, что указывало бы на любые проблемы со следующим:

$(document).ready(function () {
    // will fire IMMEDIATELY after the DOM is constructed

    $(window).load(function() {
        // will only fire AFTER all pages assets have loaded
    })

});

Размещение a .load внутри ready просто гарантирует, что DOM готов при каждом запуске load.

Можно поместить код all jQuery в одном готовом обработчике DOM, но все же может иметь подмножество кода jQuery, для которого сначала загружаются все изображения. Эта схема гарантирует, что все коды будут запускаться один раз на DOM, а остальные будут запускаться впоследствии всякий раз, когда ресурсы страницы закончили загрузку.

В конечном итоге это может быть скорее вопросом личных предпочтений, однако ОП четко спрашивает, может ли эта организация вызвать проблемы. Это не подтвердилось.

Ответ 3

Внимание: Ответы на этот вопрос довольно устарели.

Как @ViRuSTriNiTy упоминает в комментариях, что этот код уже недействителен в jQuery 3, и он упоминался как проблема на GitHub.

Так что этот метод больше не рекомендуется.

Один из способов сделать это - использовать следующий код

$(window).on("load", function(){
   $.ready.then(function(){
      // Both ready and loaded
   });
})

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