Насколько я понимаю .live() и .on(), два приведенных вами примера не совпадают.
Ваш первый:
$('#some-button').on('click', function() {
//do something when #some-button is clicked
});
не имеетlive поведение.Он находит объект #some-button и устанавливает на него обработчик событий напрямую.Это очень эффективно, но не имеет поведения .live().Если в данный момент объект #some-button не существует, обработчик событий не будет установлен никогда.Это в основном то же самое:
$('#some-button').click(function() {
//do something when #some-button is clicked
});
Ваш второй:
$('#some-button').live('click', function() {
//do something when #some-button is clicked
});
имеет live поведение.Он устанавливает обработчик событий в документе и ожидает кликов, нацеленных на объект, который соответствует «# some-button», чтобы всплыть на объект документа.Ваш второй теоретически эквивалентен этому:
$(document).on('click', '#some-button', function() {
//do something when #some-button is clicked
});
Я говорю теоретически эквивалентно, потому что он должен устанавливать одинаковые обработчики событий, но я не знаю, идентичен ли код jQuery для обработки этих двух или нет.
Одна из причин, по которой .live() устарела, заключается в том, что иметь много обработчиков .live() может быть плохо, потому что вы получаете много обработчиков событий для объекта документа.Затем каждый щелчок мыши или даже движение мыши, всплывающее к объекту документа, необходимо проверять на множестве селекторов, которые действительно могут замедлять процесс.
Другая проблема с .live() заключается в том, что он оценивает селектор "#некоторые кнопки "во время звонка, но на самом деле этот результат не используется, так что это расточительно.Версия .on() не оценивает селектор, переданный в качестве аргумента .on(), когда вы делаете первый вызов, потому что он не нужен в то время - он нужен только позже, когда поступает фактический щелчок, который нужно сравнитьк селектору.
С появлением .on() (или что-то, что вы могли ранее сделать с .delegate()), вы можете более эффективно нацеливать свои «живые» обработчики событий, не помещая их все в объект документа, а скорее помещая их в родительский объект, который не приходит и не уходит и намного ближе к тому, где реальные объекты, такие как это:
$('#some-button-parent').on('click', '#some-button', function() {
//do something when #some-button is clicked ///////
});
Это распространяет обработчики событий на разные объекты и получаетони ближе к фактическим объектам, для которых они предназначены, что означает, что вы не получите этот гигантский список обработчиков событий, которые нужно проверять по селекторам при каждом перемещении мыши или событии щелчка.Вот почему .live() был заменен и устарел.Гораздо лучше использовать .delegate() или .on() и указать родительский объект, который находится не так далеко от объекта документа.
Преимущество нового синтаксиса .on() заключается в том, что вы можете выполнять оба действия:«живые» и «статические» обработчики событий теперь с одним и тем же методом, просто изменяя способ передачи аргументов.Объект jQuery - это место, где будет установлен обработчик события, а необязательный селектор во втором аргументе является селектором, которому должна соответствовать цель события.Если вы передадите этот селектор, то все события, попадающие в объект (ы), указанный в объекте jQuery, будут иметь свою цель, сверенную с этим селектором.Если селектора нет, то будут сопоставляться только объекты, цель которых совпадает с объектом, указанным в объекте jQuery.
Итак, это все теория о том, как они работают и почему одна конфигурация должнабудь лучше другого.Если вы хотите протестировать производительность в реальном мире, вам придется разработать своего рода тест производительности для распространения и распространения обработчиков событий, вероятно, в сценарии, где у вас было много «живых» обработчиков событий.Этот тест, вероятно, нелегко выполнить, поскольку может быть сложно получить информацию о времени начала / конца обработчика событий.Вы не можете легко использовать такой инструмент, как jsperf для чего-то подобного.