JQuery получает идентификатор элемента из загруженных данных ajax

Я загружаю данные со страницы PHP с помощью JQuery, и все работает нормально. Теперь я хочу, чтобы при нажатии на один из этих загруженных элементов в предупреждении отображался идентификатор выбранного элемента. Как я могу сделать? Если я помещаю элемент вручную в div «вывод», он работает, но с элементом, созданным с помощью $.ajax(), он не работает. Вот код.

<input type="text" id="ricerca">
<div id="output" style="border: 1px solid #FF0000;"></div>

$(document).ready(function () {
    // Autocomplete
    $("#ricerca").keyup(function () {
        $(function () {
            var ricerca = $("#ricerca").val();
            $('#output').html("");
            if (ricerca.length > 0) {
                $.ajax({
                    url: 'dati.php',
                    method: 'POST',
                    data: {
                        ricerca: ricerca
                    },
                    dataType: 'json',
                    success: function (data) {
                        for (var i in data) {
                            var row = data[i];
                            var id = row[0];
                            var name = row[1];
                            $('#output').append("<a id='" + id + "' href='#'>" + name + "</a><br>");
                        }
                    }
                });
            }
        });
    });

    // Show ID
    $('#output a').click(function () {
        alert(this.id);
    });
});

jquery ajax elements
person user123456    schedule 26.03.2015    source источник
comment
Если ответ помог вам, примите ответ и проголосуйте... ;)   -  person Roy M J    schedule 26.03.2015

Ответы (3)


arrow_upward
7
arrow_downward

Вам нужно сделать следующее для динамически вводимого html:

$(document).on("click", "#output a", function() {
    alert(this.id);
});

В основном #output не будет там, когда вы впервые загрузите страницу, и, следовательно, вам нужно будет привязать к ней событие.

Итак, .on позволяет делегировать событие обработчику.

Полезные ссылки:

Что такое делегирование событий DOM?

Прямые и делегированные события

person Roy M J    schedule 26.03.2015
comment
Большое спасибо, все работает! PS: Вы пропустили скобку! ;) - person user123456; 26.03.2015

arrow_upward
1
arrow_downward

Вы должны использовать .on() для регистрации события щелчка динамически сгенерированного элемента

// Show ID

    $(document).on("click",'#output a',function() {
         alert(this.id);
    });
person Bhushan Kawadkar    schedule 26.03.2015

arrow_upward
-1
arrow_downward

Так должно быть

alert($(this).attr("id"));
person Sukanya1991    schedule 26.03.2015