twitter-bootstrap Bootstrap 4- 有没有办法使表格行可点击？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42333353/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap 4- Is there a way to make a table row clickable?
提问by bbennett36
I'm using the 'table-hover' in B4, Is there anyway to put an href to the table rows that are being hovered so they are actually clickable?
我在 B4 中使用了“table-hover”，无论如何要在被悬停的表格行上放置一个 href 以便它们实际上是可点击的？
<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">Larry the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
回答by Simon Hyll
Here's one way of doing it. Note that I'm using Javascript here, but using window.location.assign('http://www.google.com'); will do the same thing as "href". Note the single quote, not double.
这是一种方法。请注意，我在这里使用 Javascript，但使用 window.location.assign(' http://www.google.com'); 将做与“href”相同的事情。注意单引号，而不是双引号。
function hello(text) {
alert(text);
}.table-hover tr:hover {
background:#00ff00;
}<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr onclick="hello('row 1')">
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr onclick="window.location.assign('http://www.google.com');">
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr onclick="hello('row 3')">
<th scope="row">3</th>
<td colspan="2">Larry the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>