Сделайте всю строку как ссылку с помощью JS / jQuery

#javascript #jquery

#javascript #jquery

Вопрос:

Я хочу добиться этой ситуации с помощью Javascript / jQuery. Я хочу написать код, который будет использовать это a href и обтекать tr

Это пример:

 <tr>
   <td>122880</td>
   <td>John</td>
   <td>Doe</td>
   <td><a href="/preson/details/42838" class="btn btn-secondary">More</a></td>
</tr>
 

Я хочу добиться этого:

 <tr data-href="/preson/details/42838">
   <td>122880</td>
   <td>John</td>
   <td>Doe</td>
   <td><a href="/preson/details/42838" class="btn btn-secondary">More</a></td>
</tr>
 

Может кто-нибудь попытаться помочь мне с этим:

Обновить

   var elements = document.querySelectorAll('tr a');
        Array.prototype.forEach.call(elements, function (el)  {
          el.href = el.href;


          var new = document.querySelectorAll('tr');
             Array.prototype.forEach.call(new, function (e)  {
                     e.href= e.href.prop("data-href", el.href)
    
        });
 

Комментарии:

1. Что-то вроде? $(document).on("click", "tr", function() { $(this).find("a").first().click() })

2. Вы пробовали использовать .attr() ?

3. @JeremyThille, я обновляю свой вопрос

4. @freedomn-m, я обновляю свой вопрос

5. Немного яснее с ожидаемыми результатами (не обнаружил data-href в первый раз). Попробуйте: $("tr a").each(function() { $(this).closest("tr").attr("data-href", this.href); } или $("tr").each(function() { $(this).attr("data-href", $(this).find("a")[0].href)

Ответ №1:

С помощью jQuery это так просто, как :

 $("tr").each( function() {
  const $tr = $(this);
  $tr.attr("data-href", $tr.find("a").attr("href"));
}) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>122880</td>
      <td>John</td>
      <td>Doe</td>
      <td><a href="/preson/details/42838" class="btn btn-secondary">More</a></td>
    </tr>
  </tbody>
</table>