jQuery .on() не работает с jquery-ujs

Question

Итак, у меня есть приложение rails, которое отображает представления через jquery-ujs. (Данных дистанционного в URL-адресов, то загрузка файлов js.erb с такими вещами как:

$('#whatever').html('<%= j render("form") %>'); 

В моем главном файле JS, у меня есть обработчики событий, как так:

$('.action').on('click', function() { 
    console.log("clicked"); 
}); 

но на() не присоединяется к новым элементам, вставленным jquery-ujs. Я могу войти в консоль и вставить вышеуказанный код, и все прикладывается отлично (после того, как элементы уже есть), но сразу после запуска ujs, не повезло. это ошибка или я что-то не так?

Это с jQuery 1.9.1 и Rails 3 .2.13 кстати.

Answer 1

Вам необходимо связать on с родителем, например document. Теперь вы привязываетесь непосредственно к элементу .action, который по существу совпадает с $('.action').click(). Поскольку вы добавляете элементы в DOM позже, вам нужно делегировать обработчик тому, что уже присутствует перед вставкой элементов. Вы можете предоставить селектор в качестве второго параметра события .on, чтобы связать его с .action.

Посмотрите раздел «Прямые и делегированные события» in jQuery's API documentation for .on.

Это должно работать:

$(document).on('click', '.action', function() { 
    console.log('Clicked!'); 
}); 

Answer 2

Поскольку #whatever кажется статичным (существует все время) вы можете делегировать обработку к нему ..

$('#whatever').on('click','.action', function(e){ 
    console.log("clicked"); 
}); 

(при условии, что .action элементов внутри #whatever элемент)

---

См http://api.jquery.com/on/#direct-and-delegated-events для больше делегированных событий