Не могу выбрать добавленный tr с помощью jQuery

Question

Я добавляю таблицу и ее исходные тексты с помощью jQuery при поиске результата в базе данных и удаляю таблицу, когда ничего не находил. Это работает правильно.

$("#AdminSearch").bind("change keyup", function() { 
       var url = "http://localhost/PmMusic/index.php/admin/ajax/admin_search/"+$("#AdminSearch").val();
        $.getJSON(url,function(data){
            if (data.length == 0)
            {
                $("#AutoSearch").hide(1000);
                $("#AutoSearchTable").remove();
            }
            else
            {
                $("#AutoSearchTable").remove();
                $("#AutoSearch").append('<table id="AutoSearchTable">');
                for(var i = 0;i < data.length && i < 5;i++)
                    {
                     $("#AutoSearchTable").append('<tr><td id="TableSearchTR'+i+'" value="'+data[i]+'">'+data[i]+'</td></tr>');
                    }
                $("#AutoSearch").append('</table>');
                $("#AutoSearch").show(1000);    
            }
        });

    });

но когда я хочу выбрать tr, следуя коду

    $('tr').click(function(){
        alert("Hi");
    });

Когда я нажимаю на другую таблицу tr на странице, она работает, но не может выбрать tr, добавленный верхним кодом). в чем проблема?

Answer 1

Вам необходимо использовать .live () или .delegate () , чтобы прикреплять события щелчка к динамически создаваемым элементам.

$("#AdminSearch").delegate("tr","click",function() {
    alert("Hi");
});

Answer 2

Это потому, что вы связываете с .click, который применяется только к элементам, уже находящимся на странице.

Измените свой код на

$('tr').live('click', function(){
    alert("Hi");
});

Answer 3

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

$('tr').live('click', function() {
  alert("Hi");
});

Answer 4

Если TR отсутствует при добавлении функции .click (), к нему не будет прикреплено событие click.Вместо этого вы должны использовать функцию .delegate ().