Помогите правильно подключить jquery ajax
Добрый день.
Есть страница - опросник, где пользователь читает вопрос, нажимает "да" или "нет", после чего его ответ передается аяксом на сервер. С сервера возвращается новый вопрос И НОВЫЕ КНОПКИ "ДА" И "НЕТ", к которым скрипт уже не может подключится. Как сделать, что бы скрипт подключался к новоприбывшим кнопкам (подключение идет по классу кнопки)? КОД КНОПКИ: <button type="submit" name="user_answer" value="0" class="answer_button">Нет</button> КОД JS, подключается в футере страницы опросника: $(document).ready(function(){ $(".answer_button").click(function(){ var msg = $(this).val(); $.ajax({ type: 'POST', url: 'index.php', data: 'user_answer=' + msg + '&ajax=on', success: function(data) { $('.content').html(data); }, error: function(xhr, str){ alert('Error ' + xhr.responseCode); } }); }); }); Кнопки должны приходить с сервера, оставить их на странице не могу. Спасибо. |
Кнопки сами по себе или же форма?
|
Кнопки в форме:
<form method="POST" action="javascript:void(null);" class="ans_buttons"> <button type="submit" name="user_answer" value="1" class="answer_button">Да</button> <button type="submit" name="user_answer" value="0" class="answer_button">Нет</button> </form> |
Цитата:
|
В свою очередь форма является потомком блочного элемента
<div class="content"></div> Который является частью статичного содержимого страницы. |
alexgerber,
Попробуйте вместо : 09 $('.content').html(data); Это: $(data).find('form.ans_buttons').appendTo('.content:last'); |
РЕШЕНО использованием jquery функции on()
$(".content").on('click','.answer_button' , function(){ var msg = $(this).val(); $.ajax({ url: 'index.php', data: 'user_answer=' + msg + '&aj=on', success: function(data) { $('.content').html(data); }, error: function(xhr, str){ alert('Error ' + xhr.responseCode); } }); }); Пояснение кода: для работы с динамически подгружаемым контентом, указывается статический родитель подгружаемого контента (в моем случае это ".content"), в функции on() вторым аргументом передается нужный элемент. |
Цитата:
<form method="POST" class="ans_buttons"> $(".content").on('submit','form.ans_buttons' , function(e){ e.preventDefault() $.ajax({ url: 'index.php', data: $(this).serialize() + '&aj=on', success: function(data) { $('.content').html(data); }, error: function(xhr, str){ alert('Error ' + xhr.responseCode); } }); }); |
Спасибо!
|
Часовой пояс GMT +3, время: 06:44. |