Сделать интерактивную ячейку в динамической таблице с помощью JQuery

Я хотел бы добавить подробную ссылку в определенные ячейки в динамической таблице в JQuery.

Этот код отлично работает при добавлении ячейки/строки:

$('<td class="ploegen-details-naam" onclick="link_naar_info_speler(this.parentNode.childNodes[0].textContent)">
   </td>').text(speler_naam).appendTo(details_rows);

Но если я хочу добавить в ячейку динамически детализированные идентификаторы, это больше не связано:

for (var x = 0; x < len; x ++) {
   $('<td>', {id:"naam_thuis" + x}, {class:"ploegen-details-naam"},
  {onclick:"link_naar_info_speler(this.parentNode.childNodes[0].textContent)"}).text(speler_naam).appendTo(details_rows);
}

Эта функция точно такая же для двух примеров:

function link_naar_info_speler(speler_id) 
{
    location.href="/ADL/Info/Spelers/Spelers.html?" + speler_id;
}

Часть, которая не работает во втором примере, — это клик по ссылке. Я разместил только соответствующий код, так как остальная часть кода одинакова в двух случаях.


dynamic jquery hyperlink onclick cell
person Peter Verreyde    schedule 14.02.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

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

Пример:

for ( var i = 0; i < 4; i++ ) {
  $('<p>', { id: `id${i}`, class: 'my-class', onclick: 'echoMyId(this)' }).text(i).appendTo('#container');
}

function echoMyId (paragraph) {
  console.log(paragraph.id);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
</div>

person Taplar    schedule 14.02.2020