0

Есть скрипт:

while ($result= mysqli_fetch_assoc($query)) {
    print '<div class="friendList-ask">
               <a class="btn-main" href="#">Done</a>
           </div>';
}

Данный HTML код попадает на страницу с помощью ajax:

$.ajax({
    url: 'search.php',
    success: function (data) {
            $('.userList').html(data);
            }
})

Проблема в том что после попадания данного кода на страницу, к нему не получается обратиться с помощью jQuery:

$(".friendList-ask .btn-main").on("click", function () {
    event.preventDefault();
    alert("Hello");
})

Тоесть данный код не работает. jQuery скрипт не находит его.

В чем же проблема? Как ее решить?

2 ответа 2

3

Это класическая тема, на момент выполения скрипта

$(".friendList-ask .btn-main").on("click", function () {

элемент .friendList-ask .btn-main не существует, событие привязать не к чему.

Нужно использовать всплытие событий и закрепить его на внешнем постоянном враппере над .friendList-ask или на document,вот так:

$(document).on("click", ".friendList-ask .btn-main", function(){ .....  })
3

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

 $('#container_body').on('click', '.friendList-ask .btn-main', function(){
        event.preventDefault();
        alert("Hello");
    });

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.