.live () против метода .on () - PullRequest
Новая
       3

.live () против метода .on ()

0 голосов
/ 09 февраля 2012

Я работаю над проектом, в котором, когда я продолжаю нажимать кнопку «мин / плюс», не отрывая изображение с помощью метода .live(), функция работает. В случае метода .on() функция не работает.

Как я могу исправить эту проблему, чтобы она работала и для метода .on()?

Вот пример того, что я имею в виду (в этом примере я исправил ошибку, но неправильно использовал метод .on).

Ответы [ 2 ]

31 голосов
/ 09 февраля 2012

Вы не используете это правильно. Замена для .live() - $(document).on() с передачей события и обработчика, конечно ... например: 

$(document).on('click', '#myElement', function() { 
  //... some function ...
});

Стоит отметить, что до того, как .on() когда-либо появлялся, .live() уже считался неэффективным способом справиться с такого рода связыванием. Вместо этого было рекомендовано .delegate(), а теперь .on() (с использованием синтаксиса делегата).

Или как пример: вместо документа, являющегося слушателем (что и делал .live()), вы должны выбрать ближайшего предка, который не будет уничтожен при манипуляциях с DOM. Честно говоря, я нахожу "jsdo.it" немного неуклюжим, поэтому я не имею в виду конкретный элемент, но, например, учитывая структуру: 

<div id="ajax_container">
 <button id="do_something">Clicky!</button>
 <p>Some dynamically-loaded content</p>
</div>

Если содержимое ajax_container заменяется вызовом Ajax (не нужно показывать код для этой части), привязка неразрушенного слушателя (div контейнера) к событию click этой кнопки будет выглядеть следующим образом: 

$('#ajax_container').on('click', '#do_something', function() {
 // do something
})
0 голосов
/ 09 февраля 2012

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

<div id="parent">
 <a href="#" id="anchor">Click Me</a>
</div>

$('#anchor').live('click',function() { }):
$('#parent').on('click','#anchor',function() { });
$('#anchor').on('click',function() { });

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

Во втором примере ($ ('# parent'). On ()) прослушиватель событий добавляется к родительскому элементу и запускается каждый раз, когда событие щелчка всплывает до #parent и приходит из (или взаимодействует с по пути) элемент с именем # anchor

Третий пример ($ ('# anchor'). On ()) добавляет прослушиватель событий непосредственно к самому элементу привязки и точно такой же, как $ ('# anchor'). Bind ('click', function () {});

Причина, по которой был введен .live (), заключалась в том, что, если ваша структура страницы изменяется, обратные вызовы событий все еще могут запускаться, потому что сам прослушиватель событий присоединен к элементу документа.

Вы можете использовать on в аналогичном методе, но он должен быть присоединен к элементу, который не удаляется со страницы - если этот элемент удален, то все слушатели событий вместе с ним.

http://api.jquery.com/on/ http://api.jquery.com/live/

...