Question

我有一个可点击的面板，其中有一个工具提示。代码如下：

<a href="/venues/manage/">
 <div class="col-md-4">
    <div class="panel panel-default">
     <img src="/img/venue.svg">
     <h5 class="text-vert crop"><b>Venue Title</b><a href="#" data-toggle="tooltip" title="Verified Venue">Verified</a></h5>
    </div>
 </div>
</a>
<script>
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();
});
</script>

当我将鼠标悬停在工具提示文本上时，它可以正常工作。关于工具提示的一些内容与主链接<a href="/venues/manage/">混淆。单击图像时，链接正常。当我单击文本Venue Title时，它可以正常工作。但是，如果我点击<div class="col-md-4">中的任何其他位置（例如文本右侧），则链接不起作用。

是否可以在另一个<a>内添加<a>工具提示？

Answer 1

为了嵌套a，请进行以下更改....

您必须将嵌套的内容包装在object标记内。

<a href="/venues/manage/">
 <div class="col-md-4">
    <div class="panel panel-default">
     <img src="/img/venue.svg">
     <h5 class="text-vert crop">
         <b>Venue Title</b>
         <object><a href="#" data-toggle="tooltip" title="Verified Venue">Verified</a></object>
     </h5>
    </div>
 </div>
</a>

这是一个bootply（请参阅生成的HTML）：http://www.bootply.com/MmYwCLTF0P

以下是Vitaly Friedman的会议：https://vimeo.com/162334949

href里面的href

1 个答案: