Question

我正在尝试将引导工具提示添加到html按钮但没有成功。我尝试过在网络上找到的大量例子，但根本无法显示工具提示。

我添加了bootstrap.js，jquery.js，虽然我听说bootstrap.js中包含了工具提示js，但我下载并尝试了bootstrap-tooltip.js。

我试图通过引用类和rel =来启动工具提示。唯一可以使工具提示显示的是添加选项show，这使它一直显示。

以下是我最近的尝试...

 <div class="input-xxlarge">
      <div class="input-append">
          <asp:DropDownList ID="ddStylists" AutoPostBack="true" OnSelectedIndexChanged="ddStylists_SelectedIndexChanged"
               CssClass="input-xxlarge" DataSourceID="lnqStylists" DataTextField="fullName" DataValueField="StylistID" runat="server">
                    <asp:ListItem Value="-1" Selected="True">---Select Stylist---</asp:ListItem>
          </asp:DropDownList>
          <a href="#" class="link" data-original-title="first tooltip">Hover me for a tooltip</a>!
          <button id="btnSchedule" runat="server" data-placement="right" rel="tooltip" data-original-title="Send Info" class="button button-basic button-basic-orange">
                    <i class="icon-calendar"></i>
          </button> 

      </div>
 </div>

<script type='text/javascript'>
    $('.link').tooltip();
</script>

<script src="../Scripts/ease/js/jquery.min.js"></script>
<script src="../Scripts/ease/js/bootstrap.min.js"></script>

我做错了什么？

由于

Answer 1

尝试使用html标记data-toggle，看看它是否有效。

<a class="link" data-toggle="tooltip" data-trigger="hover"
  data-original-title="Some Text!">Hover me!</a>

jsFiddle

Answer 2

您是否在加载J Query和Bootstrap后尝试初始化工具提示？

<script src="../Scripts/ease/js/jquery.min.js"></script>

<script type='text/javascript'>
$('.link').tooltip();

熟悉所有浏览器的开发者控制台，你可以检查各种各样的事情，这也可以阻止你从这些问题中解脱出来

无法获取引导工具提示在Web表单中工作

2 个答案: