я запутался с нагрузкой JQuery - PullRequest
1 голос
/ 19 мая 2011

с jquery, как я могу сделать что-то сразу после загрузки DOM, я пишу так:

<script>
$("#google").load(function() {
  alert('ok');
});
</script>
<img src="http://www.google.com/images/logos/ps_logo2.png" id="google" />

но ничего не происходит ~ если я использую готов () вместо загрузки, как это:

 <script>
    $("#google").ready(function() {
      alert(this);
      alert('ok');
    });
    </script>
    <img src="http://www.google.com/images/logos/ps_logo2.png" id="google" />

, это будет работать, но указатель "this" не будет $ ("# google"), и, похоже, это "окно" или другие вещи, я запутался ~

Ответы [ 5 ]

3 голосов
/ 19 мая 2011

Если я правильно понял, вы хотите манипулировать #google после , DOM полностью загружен. Тогда то, что вы хотите использовать, это на самом деле $(document).ready(function() {//do stuff with #google});

.load() используется для выполнения запросов ajax. Вы должны прочитать об этом здесь

Также было бы интересно узнать, динамически генерируется #google или нет.

Да, и во втором примере вы не можете сделать alert(this). alert() просто принимает строку в качестве параметра.

1 голос
/ 19 мая 2011

В вашем первом коде вы ищете элемент #google и говорите ему, чтобы он уведомлял вас, когда загружается его изображение.Однако в то время, когда выполняется javascript ( над элементом в коде), существует существует no #google элемент, и, таким образом, прослушиватель событий не назначается чему-либо.

К сожалению, добавление прослушивателя событий внутри DOMReady прослушивателя также не всегда решит проблему.Если, например, изображение уже находится в кэше браузера, событие загрузки #google может произойти до DOMReady.Похоже, самый безопасный подход - подключить слушателя немедленно после , когда изображение будет создано.

<img src="http://www.google.com/images/logos/ps_logo2.png" id="google" />
<script type="text/javascript">

$('#google').load(function() {
   alert('ok');
});

</script>

Рабочий пример

Если выне довольный тем, что вставлял блок скрипта в середину вашего кода, но хотел бы отложить ваш скрипт на какое-то место позже, вы всегда можете слушать $(window).load() вместо $('#google').load().Это эквивалентно <body onload="">, т.е. оно будет работать, когда весь внешний контент был загружен.Поэтому, когда происходит $(window).load(), вы знаете, что ваше #google изображение загружено, но оно не обязательно будет немедленно после его загрузки.

0 голосов
/ 19 мая 2011

Сначала необходимо связать обработчик событий с событием загрузки, а затем установить src образа для фактического запуска загрузки.

$('#google').bind("load", function() {
    alert('ok');
});
$("#google").attr("src", "http://www.google.com/images/logos/ps_logo2.png");

см. Это: http://jsfiddle.net/VaLhf/

0 голосов
/ 19 мая 2011

Просто используйте следующее:

$(document).ready(function() {
   alert("The DOM has loaded");
});

Функция .load используется для запуска ajax-вызова и помещения ответа в указанный div.

0 голосов
/ 19 мая 2011

Попробуйте вместо этого:

$(function() {
    var that = $("#google");
    alert(that);
});

Этот код будет запущен, когда DOM полностью загружен, что вызвано событием $(document) ready () .

...