Разница между jQuery.live и jQuery.delegate

Question

Я прочитал пост о том, почему не использую jQuery.live (), и я хочу проверить, получил ли я его :) Когда я звоню $("body").delegate('element','click', function);

Это то же самое, что и $(element).live('click', function)? В случае нормального поведения. Согласно посту, есть некоторые преимущества stopPropagation и производительности, но является ли основным отличием то, что live связывается каждый раз с элементом body, а делегат может связываться с другим?

Answer 1

Одним из важных отличий является то, что ".live ()" фактически создаст список элементов jQuery для начального селектора, даже если самой функции ".live ()" нужна только строка селектора.Это означает, что если селектор несколько дорогой, код для установки обработчика будет работать по всей DOM без веской причины.Вызов ".delegate ()" делает , а не делает это.

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

Answer 2

Nettuts имеет скринкаст, чтобы объяснить это: Быстрый совет: разница между Live () и Delegate ()

Цитата с сайта:

// Live(), introduced in 1.3, allows for the binding  
// of event handlers to all elements that match a  
// selector, including those created in the future.  
// It does this by attaching the handler to the document.  
// Unfortunately, it does not work well with chaining.  
// Don't expect to chain live() after calls like  
// children().next()...etc.  
$("li").live("click", function() {  
    $(this).parent().append("<li>New Element</li>");  
});   

// Delegate, new to version 1.4, perhaps should have been a complete  
// replacement for Live(). However, that obviously  
// would have broken a lot of code! Nonetheless,  
// delegate remedies many of the short-comings  
// found in live(). It attaches the event handler  
// directly to the context, rather than the document.  
// It also doesn't suffer from the chaining issues  
// that live does. There are many performance benefits  
// to using this method over live().  
$('#items').delegate('li', 'click', function() {  
    $(this).parent().append('<li>New Element</li>');  
});   

Answer 3

- главное отличие в том, что live связывается каждый раз с элементом тела, а делегат может связываться с другим?

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

Answer 4

Короче говоря, .live работает на уровне документа, а .delegate - на любом указанном вами элементе.Почему это имеет значение?Если у вас есть событие mousemove (или несколько), связанное с помощью .live, jQuery будет выполнять код каждый раз, когда вы перемещаете указатель мыши в любое место на странице, чтобы увидеть, должна ли выполняться функция обратного вызова.Это крайне неэффективно и является причиной наличия .delegate..delegate функции запускаются только тогда, когда чет начинается с указанного вами узла dom.Если, например, вы сказали $('ul#myUL').delegate(...), то jQuery будет проверять только, должен ли код выполняться, когда событие происходит из ul#myUL

Answer 5

Поскольку метод .live () обрабатывает события после того, как они распространяются на верхнюю часть документа, невозможно остановить распространение живых событий.Аналогично, события, обрабатываемые .delegate (), всегда будут распространяться на элемент, которому они делегированы;Обработчики событий для любых элементов ниже этого будут уже выполнены к тому времени, когда вызывается делегированный обработчик событий.