我试图在表格中使整行(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>
它不起作用。请告诉我们如何做到这一点。
提前致谢:)
答案 0 :(得分:2)
$(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>