Блог

Я работаю над руководством по jQuery, и есть кое-что, чего я не совсем понимаю, почему. Ниже приведен раздел, который я вырезал из руководства. Предложение, выделенное жирным шрифтом, — это та часть, которую я не понимаю и хотел бы, чтобы какой-нибудь эксперт объяснил мне это. Очень признателен!

«Очень распространенная проблема, возникающая при загрузке содержимого с помощью Ajax, заключается в следующем: при добавлении обработчиков событий в ваш документ, которые также должны применяться к загруженному содержимому, вы должны применять эти обработчики после загрузки содержимого. Чтобы предотвратить дублирование кода, вы можете делегировать функции. Пример:

  function addClickHandlers() {
   $("a.remote", this).click(function() {
     $("#target").load(this.href, addClickHandlers);
   });
 }
  

$(документ).готово (addClickHandlers);
Теперь addClickHandlers вызывается один раз, когда DOM готов, а затем каждый раз, когда пользователь нажимает на ссылку с помощью class remote и загрузка содержимого завершается.

Обратите внимание на запрос $(«a.remote», this), он передается как контекст: для события document ready это относится к документу, и поэтому он выполняет поиск по всему документу на предмет привязок с классом remote. Когда addClickHandlers используется в качестве обратного вызова для load(), это относится к другому элементу: в примере, элементу с id target.Это предотвращает повторное применение события click к одним и тем же ссылкам, что в конечном итоге приводит к сбою.»

 function addClickHandlers() {
    // this is window
    $("a.remote", this).click(function() {
        // this is a <a class="remote">
        $("#target").load(this.href, addClickHandlers);
    });
}
  

В общем случае this контекстом в функции является window , если только она не вызывается с new ключевым словом или если она вызывается как obj.method() (в этом случае это obj так).

Потому что вызов функции addClickHandlers() фактически вызывает window.addClickHandlers() , что означает, что this значение является областью действия window .

Где, поскольку сам jQuery будет иметь область this , чтобы быть элементом, который вы используете внутри функций обратного вызова.

В .click(function() { ... }) this будет ссылаться на объект, на который был нажат.

Почему вы не можете просто выполнить live() привязку обработчика, вот так:

 $('#target .elements').live('click', function() {
  ...
});