Функция jQuery.click не работает с тегом <td>?

Итак, я создаю таблицу с использованием Javascript и jQuery, и я хочу, чтобы при нажатии кнопки td в первой строке таблицы остальная часть td в этом столбце выпадала. Позвольте мне попытаться объяснить это, показывая мой код. Вот мой Javascript:

function createTr (heights) { //heights is just an array of words
    for (var h=0; h<heights.length; h++) { 
        var theTr = $("<tr>", { id: "rowNumber" + h});
        for (var i=0; i<heights.length-3; i++) { 
            theTr.append($("<td>", { "class": "row"+h + " column"+i,
                                     html: heights[h][i]
                                   }));
        }
        $('#newTable').append(theTr); // append <tr id='rowNumber0'> to the table (#newTable), which is written in the html
    }
}

В основном это создает td, и каждый td похож на этот формат

<td class="rowh columni">

Я хочу, чтобы все td были скрыты, кроме td в .row0, и если вы нажмете td в .row0.columni, тогда появится все td в .columni. Параметр "высоты" представляет собой массив jsut, например, он может быть

var heights = [['headerOne', 'headerTwo'], ['someTd', 'anotherTd'],];

и он создаст таблицу, используя эти слова, headerOne и headerTwo будут в первой строке, someTd и anotherTd будут во второй строке.

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

function animation() {
    $('td').click( function() {
        alert('clicked');
    });
}

а затем вызовите его в моей функции document.ready так

$(document).ready( function() {

    createTr(heights);
    animation();
});

он ничего не делает, когда я нажимаю td. Почему?

Ответ 1

http://api.jquery.com/on/

Поскольку вы создаете элементы после создания DOM. Используйте селектор "on", чтобы получить точный элемент, который динамически создается.

Из URL-адреса:

   $("#newTable").on("click", "td", function() {
     alert($( this ).text());
   });

Ответ 2

Попробуйте вот так:

$('body').on('click','td', function() {
        alert('clicked');
    });

Ответ 3

попробуйте это

function animation() {
    $(document).on('click','td',function() {
    alert('clicked');
    });
}

Ответ 4

Этот код работает очень хорошо:

$(document).ready(function(){
    $("td").click(function(){
        if(this.title!=""){
            alert(this.title);
        }
    });
});

Ответ 5

Мне это нравится.

 $("#table tr").click(function(){
    console.log(this);
});