Преимущества подхода jQuery для делегированных событий для Grid

Делегирование (метод 2) должно использоваться, когда элементы, которые соответствуют селектору, изменяются динамически. Вы должны использовать это только при необходимости для этой цели. Он устанавливает обработчик на элемент в селекторе, что .on применяется к, а затем должен проверить, соответствует ли целевой элемент селектор в списке аргументов; это зависит от того, что событие перетекает из внутреннего элемента в элемент, к которому вы привязываетесь. Это менее эффективно, чем привязка непосредственно к целевому элементу, поскольку браузер полностью реализует это.

Первая форма должна использоваться, когда элементы статичны. Селектор соответствует всем им, когда DOM готов, и привязывает обработчики к каждому из них.

Прочтите .on()

Поскольку новые элементы, добавленные javascript, не являются частью DOM при готовности DOM или загрузке страницы, поэтому вам необходимо использовать Event Delegation

Это мероприятие

$("#dataTable tbody").on( "click", "tr", function() {

объяснение выше кода

Мы прикрепляем обработчик событий к элементу с идентификатором dataTable, содержащей tbody тега, так что если больше tr добавляется dynamically, чем click случае будет работать на новом добавленном tr.

Но если для использования ниже кода, чем новый добавленный tr, к нему не будет прикреплен click event handler.

Ниже код будет работать, если элементы присутствуют в DOM в DOM ready или Page Load.

$( "#dataTable tbody tr" ).on( "click", function() {}

равно

$( "#dataTable tbody tr" ).click(function() {});