javascript - 如何使整个<tr>行在laravel中可点击？

我试图使整个行（tr）在表中可单击。这是我讨厌的代码，

<table class="container">
   <thead>
      <tr>
        <th><h1>Id</h1></th>
        <th><h1>Number</h1></th>
        <th><h1>Type</h1></th>
        <th><h1>Value</h1></th>
      </tr>
  </thead>
  <tbody>
        @for ($i = 0; $i < $count; $i++)
        <tr class="table-tr" data-url="http://www.engineering.us/gena/details.php">
          <td>{{ $data_array[$i]['id'] }}</td>
          <td>{{ $data_array[$i]['number'] }}</td>
          <td>{{ $data_array[$i]['name'] }}</td>
          <td>{{ $data_array[$i]['value'] }}</td>
       </tr>
@endfor
 </tbody>

`

还有JS脚本，

<script type="text/javascript">
  $(function () {
    $(".container").on("click", "tr[data-url]", function () {
      window.location = $(this).data("url");
    });
  });
</script>

它不起作用。请告诉我们如何做到这一点。

提前致谢 ：）

最佳答案

$(function() {
  $('table.container').on("click", "tr.table-tr", function() {
    window.location = $(this).data("url");
    //alert($(this).data("url"));
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="container">
  <thead>
    <tr>
      <th>
        <h1>Id</h1></th>
      <th>
        <h1>Number</h1></th>
      <th>
        <h1>Type</h1></th>
      <th>
        <h1>Value</h1></th>
    </tr>
  </thead>
  <tbody>
    <tr class="table-tr" data-url="http://www.engineering.us/gena/details.php">
      <td>id</td>
      <td>number</td>
      <td>manash</td>
      <td>28</td>
    </tr>
  </tbody>
</table>

关于javascript - 如何使整个<tr>行在laravel中可点击？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41520202/