jQuery - несколько $(документ).ready ...?

Вопрос:

Если я свяжу в двух файлах JavaScript, оба с $(document).ready функции, что происходит? Один перезаписывает другой? Или сделать оба $(document).ready позвонить?

Например,

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type="text/javascript" src="http://.../jquery1.js"></script>

<script type="text/javascript" src="http://.../jquery2.js"></script>

jquery1.js:

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
});

jquery2.js:

$(document).ready(function(){
    $("#page-subtitle").html("Document-ready was called!");
});


Я уверен, что лучше всего объединить оба звонка в один $(document).ready но это не совсем возможно в моей ситуации.

6 ответов

Решение

Все будет выполнено и на первом вызове!

<div id="target"></div>

<script>
  $(document).ready(function(){
    jQuery('#target').append('target edit 1<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 2<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 3<br>');
  });
</script>

Демо Как видите, они не заменяют друг друга

Также я хотел бы упомянуть одну вещь

вместо этого

$(document).ready(function(){});

Вы можете использовать этот ярлык

jQuery(function(){
   //dom ready codes
});

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

Это применяется независимо от синтаксиса. Ты можешь использовать jQuery(), jQuery(function() {}), $(document).ready()Что бы вы ни хотели, поведение остается прежним. Если ранний сбой, последующие блоки никогда не будут запущены.

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

$(Документ).ready(); такой же, как и любая другая функция. он срабатывает, когда документ готов - т.е. загружен. вопрос в том, что происходит, когда запускается несколько $(document).ready(), а не когда вы запускаете одну и ту же функцию в нескольких $(document).ready().

//this
<div id="target"></div>

$(document).ready(function(){
   jQuery('#target').append('target edit 1<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 2<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 3<br>');
});

//is the same as
<div id="target"></div>

$(document).ready(function(){

    jQuery('#target').append('target edit 1<br>');

    jQuery('#target').append('target edit 2<br>');

    jQuery('#target').append('target edit 3<br>');

});

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

в заключение, где только возможно, используйте только 1 $(document).ready();

// старый ответ

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

Исполнение сверху вниз. Первым прибыл - первым обслужен Эквивалент в русском языке: поздний гость гложет и кость.

Если последовательность выполнения важна, объедините их.

Оба будут вызваны, первым пришел, первым обслужен. Посмотрите здесь.

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
  });

$(document).ready(function(){
    $("#page-title").html("Document-ready 2 was called!");
  });

Выход:

Документ готов 2 был вызван!

Не в некро нить, а под последнюю версию jQuery Предлагаемый синтаксис:

$( handler )

Используя анонимную функцию, это выглядело бы как

$(function() { ... insert code here ... });

Смотрите эту ссылку:

https://api.jquery.com/ready/

Другие вопросы по тегам