Обработка события jQuery onClick на руле
Я хотел бы создать простое событие jQuery onClick, чтобы сделать динамический интерфейс пользователя в шаблоне рулей. Мне было интересно добавить addClass() после определенного щелчка.
рассмотрим HTML (сгенерированный ручками)
{{#if hasButton}}
<div id="container">
<button type="submit" class="myButton">Click me!</button>
</div>
{{/if}}
i.e: после щелчка по кнопке, его контейнер получит класс загрузки, который будет создавать взаимодействие с помощью CSS.
$(".myButton").on("click", function(event){
$(this).parent().addClass("loading");
});
Этот код должен идти по моему шаблону handlebars или мне нужно переписать его в конкретный помощник для него? Есть ли какие-либо примеры, которые можно было бы предоставить, чтобы я мог изучить его, а затем разработать нечто подобное?
Спасибо заранее!
Ответы
Ответ 1
Вы должны обновить своих JQuery-слушателей ПОСЛЕ вставки узлов в ваш DOM-код HTML.
var source = "<li><a href="{{uri}}">{{label}}</a></li>";
var template = Handlebars.compile(source);
var context = {"uri":"http://example.com", "label":"my label"};
$("ul").append( template(context) );
// add your JQuery event listeners
$("li").click(function(){ alert("success"); });
Ответ 2
нет необходимости повторно привязывать обработчик событий к каждому динамическому обновлению DOM, если вы определяете их на уровне документа:
$(document).on('click','li',function(){
alert( 'success' );
});
Надеюсь, это поможет!: -)
Ответ 3
Я не уверен, в чем проблема.
Правильно, если вы сохраните свой JavaScript в файле *.js, perhaps
, используя parent() вместо этого в prev()
в этом конкретном случае.