【问题标题】:bootstrap hyperlink not working引导超链接不起作用
【发布时间】:2015-09-03 06:48:37
【问题描述】:

我一直试图让实际的行成为超链接(可点击),但似乎他们不想成为活动链接,我在谷歌上搜索过,网站说要使用“a href”我已经完成了,但由于某种原因它对我不起作用,这是一个引导布局,如果有人可以帮助我,那就太好了,非常感谢

编辑:我尝试将“class='clickable-row' data-href='url://link-for-first-row/'”添加到 tr 元素,但它似乎仍然没有正在工作,我确实尝试更新 jsfiddle 链接,但是当我尝试保存它以在此处发布链接时,jsfiddle 数据会从我的屏幕上擦除。

https://jsfiddle.net/r6wctrwk/

<div class="container">
<table class="table table-bordered">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
</thead>
<tbody>
<a href="#">
<tr>
<td>John</td>
<td>Doe</td>
</tr>
</a>
<a href="#">
<tr>
<td>Mary</td>
<td>Moe</td>
</tr>
</a>
<a href="#">
<tr>
<td>July</td>
<td>Dooley</td>
</tr>
</a>
</tbody>
</table>
</div>

【问题讨论】:

  • 我尝试将“class='clickable-row' data-href='url://link-for-first-row/”添加到 tr 元素,但它不想要为了工作,我尝试更新 jsfiddle 链接以在此处发布,但我遇到了一些问题。
  • @Emma-May 该链接绝对可以回答您的问题。让我在答案部分举个例子......

标签: html twitter-bootstrap hyperlink


【解决方案1】:

根据我的评论,这是 akash 提供的链接的工作方式。

示例代码:

<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

  <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
</head>
<body>
<table>
<tbody>
    <tr class='clickable-row' data-href='http://google.com'>
        <td>Column 1</td>
        <td>Column 2</td>
        <td>Column 3</td>
    </tr>
</tbody>
</table>
<script>
jQuery(document).ready(function($) {
    $(".clickable-row").click(function() {
        alert("click");
        window.document.location = $(this).data("href");
    });
});
</script>
</body>
</html>

您可以包含类似这样的样式

<style>
    .clickable-row:hover{
         text-decoration: underline;
         cursor: pointer;
    }
    </style>

【讨论】:

  • 哦,现在我明白出了什么问题,您的正确链接确实有效(谢谢),但是当我将鼠标悬停在链接上时,它并没有显示它是一个链接(在 chrome 中)在那里有什么方法可以显示它是一个链接? (编辑,我的意思是当我将鼠标悬停在链接上时,它没有显示为浏览器底部状态中的链接)
  • 感谢更新,所以我明白这是它在引导程序中工作的“正常”方式吗?
  • 一般意义上的 html 不在引导程序中...锚具有默认行为设置,这就是为什么当您将鼠标悬停在锚上时会在左下角看到链接。
  • 你好,我可以确认当鼠标悬停在链接上时是否无法强制锚点在浏览器左下角显示链接?非常感谢
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-06-27
  • 1970-01-01
  • 2013-05-22
  • 1970-01-01
  • 1970-01-01
  • 2018-09-08
  • 2012-07-09
相关资源
最近更新 更多