#javascript #jquery #html
#javascript #jquery #HTML
Вопрос:
Здравствуйте, у меня возникла проблема с функцией .html в jquery. прослушиватель событий больше не работает каждый раз, когда я удаляю скрипт из кодов и вставляю его снова. можете ли вы помочь мне, как создать реактивный скрипт после его повторной вставки в html.
Комментарии:
1. В частности, «больше не работает» не очень описывает. Точно опишите, что вы ожидаете, и что происходит на самом деле, включая любые сообщения об ошибках. Задавая вопрос о коде, указывайте минимальный образец . Для веб-страниц включайте ссылку на текущую страницу; с другой стороны, лучше всего, чтобы вопросы в SO были автономными. Джон Скит опубликовал другие рекомендации по заданию идеального вопроса . Также ознакомьтесь с часто задаваемыми вопросами SO и немного поищите.
2. спасибо за этот комментарий, чувак. Я изменю свой вопрос к лучшему.
Ответ №1:
Вы можете настроить свои события с помощью .live() метода. Нравится:
$("#submit_button").live("click",function(e){
});
Таким образом, если вы добавляете / удаляете html со своей страницы с помощью .html() метода, события останутся нетронутыми.
Надеюсь, это поможет.
Ответ №2:
Вы могли бы использовать .live() метод для регистрации обработчика события, который сохранит его, даже если соответствующий элемент DOM будет воссоздан. Пример:
$(function() {
$('#someid').live('click', function() {
//
});
});
Ответ №3:
Я предполагаю, что вы изменяете внутренний html-код некоторого контейнера с помощью функции .html () jquery, и назначенные вами события теряются после процесса. Вы можете использовать два подхода:
Если содержимое не изменилось, используйте функцию .detach(), чтобы удалить и вставить свои элементы обратно. Функция .detach() сохраняет обработчики событий, прикрепленные к элементам, которые вы отсоединяете. Однако, если вы вставляете другой контент, используйте событие .live() для назначения ваших событий. События, назначенные с помощью .live(), будут воссозданы заново, когда элемент с тем же селектором будет вставлен в dom.
Комментарии:
1. Я думаю, что это ответ, который я ищу. Я надеюсь, что это сработает.
2. Спасибо за этот отличный ответ, чувак. Да, ситуация такова, что я изменяю содержимое (.html ()) некоторого контейнера, а затем, когда оно вставляется обратно (.html ()), обработчики событий уже потеряны. Я пытался использовать функцию .detach и поместить ее в переменную, но ее нельзя вставить обратно с помощью .html() Как я могу поместить объект .detach в переменную javascript?
3. Разница между .html() и другими методами манипулирования dom в jquery заключается в том, что функция .html() преобразует строку в dom. Таким образом, он не может сохранить ни одно из событий. Вы можете использовать функцию .append(), чтобы вставить элементы обратно в dom.
4. Вы можете использовать функцию добавления следующим образом. Надеюсь, это поможет. var elements = $(«ваши селекторы»).detach(); $(«селектор родительского тега ваших элементов»).append(элементы);
5. Привет, чувак, я уже исправил проблему. Я неправильно понял разницу между .detach и .html. вот что я сделал с .html. var a = $(container).html(); $(container).empty(); $ (container).html(a); в то время как в .detach этого не произойдет, потому что использование .detach приведет к удалению элемента вместо получения его содержимого. Я решаю проблему следующим образом — var a $ (container).contents().detach(); $ (container).html(a); кстати, спасибо за твою помощь, чувак.
Ответ №4:
Используйте это в качестве примера:
$('a.button').live('click', function(){
//anchor tag clicked.
alert('Button has been clicked');
});
.live() :
Прикрепите обработчик к событию для всех элементов, которые соответствуют текущему селектору, сейчас и в будущем.
Метод .live() способен влиять на элементы, которые еще не были добавлены в DOM, с помощью делегирования событий.
Это означает, что вы добавляете и удаляете html со своей страницы с помощью .html() , и ваши события все равно будут выполняться.
Смотрите веб-сайт jQuery для получения дополнительной информации о .live()
Краткий пример jsFiddle.