0

我正在尝试向我的应用程序添加工具提示，到目前为止我得到了这个：

.span1
  ID
  =link_to "?", "#", rel: "tooltip", title: "Order Number"
  = order.id

这会生成这个 HTML：

 <div class="span1">ID<a href="#" rel="tooltip" title="" data-original-title="Order Number">?</a>...</div>

我想获得一个ID？字符串，如果用户悬停在上面，?他会看到工具提示。没有任何反应，如果我点击我重新加载页面。虽然检查 dom 我看到当我在 hoover 上时?，有一个

<div class="tooltip fade top in" ....

正在生成。不幸的是，当我将鼠标悬停时，div 消失了，所以我无法展开 div 来查看里面的内容。

bootstrap 负载相当高，并且它可以在其他东西（脚手架，可折叠等）上正常工作

我的bootstrap.js.coffee阅读：

jQuery ->
  $("a[rel=popover]").popover()
  $(".tooltip").tooltip()
  $("a[rel=tooltip]").tooltip()

任何线索？

谢谢，

更新：

我设法让一些工具提示起作用，但不是全部：

  %a{rel: "tooltip", title: "Expand"}
    %span.icon-plus{data: {toggle: "collapse", target: "\##{order_id}"}}
  = link_to edit_order_path(order), rel: "tooltip", title: "Edit Order" do
    %span.icon-edit
  = link_to order_path(order), rel: "tooltip", title: "Delete", method: :delete, data: { confirm: 'Are you sure?' } do
    %span.icon-remove

前两个链接有工具提示，第三个没有工具提示。method: :delete我相信这与参数添加nofollow到的事实有关rel，这会破坏工具提示。关于如何解决这个问题的任何线索？

4

1 回答 1

0

我不确定这是一个解决方案还是解决方法，我已经设法通过添加bootstrap.js.coffee以下内容来使其工作：

$("span[rel=tooltip]").tooltip()

并将最后一个链接定义更改为：

= link_to order_path(order), method: :delete, data: { confirm: 'Are you sure?' } do
  %span.icon-remove.idrow{rel: "tooltip", title: "Delete"}

我现在还可以在包含 ajax 调用的链接上看到工具提示。

于 2013-10-23T10:55:49.700 回答