Javascript 在按钮悬停时触发popover

我到处寻找解决办法，但我想到的一切都不管用。我想做的很简单：我只希望出现一个popover，它描述了当你将鼠标悬停在按钮上时按钮的功能。按钮的代码如下所示：

<button class="btn btn-danger deleteLine" type="button" id="deleteLine_<@=lineCount@>"><i class="icon-remove"></i></button>

我在id上尝试了一个正则表达式，在id中的任何地方寻找匹配项：

$('[id*="deleteLine_"]').popover({ 
    trigger: "hover focus",
    content: "Delete this line."
});

$('button[id*="deleteLine_"]').popover({ 
    trigger: "hover focus",
    content: "Delete this line."
});

我也试着锁定到课堂上

$('.deleteLine').popover({ 
    trigger: "hover focus",
    content: "Delete this line."
});

三次全出局。我希望避免必须内联编写onmouseover和onfocus属性。由于线条的动态特性，我不能在模态的其他部分进行静态赋值

我在IE10和FF21中使用Bootstrap 2.3.2和jQuery 2.1.1。不幸的是，升级到新版本不是一个选项。

HTML

---

为什么不使用工具提示呢？不管怎么说，这就是工具提示的作用。有人客户端拒绝了工具提示，因为它们与其他地方的信息图标不匹配。你可以在这个解决方案中尝试多种触发条件的技术：我将你的代码放在这里，效果很好。你是在每一行添加popover吗？我不是在每一行添加popover，我是在试图避免它。我想做的是说，嘿，模态上有多个类似这样的按钮，如果用户将鼠标悬停在其中任何一个按钮上，请显示此弹出窗口。没有问题，先生：

$('.deleteLine').popover({ 
    trigger: "hover focus",
    content: "Delete this line."
});

<p title="this is title">What is this</div>

  $(function() {
      $('[title]').attr("data-rel", "tooltip");
      $("[data-rel='tooltip']")
          .attr("data-placement", "top")
          .attr("data-content", function() {
              return $(this).attr("title")
          })
          .removeAttr('title');


      var showPopover = function() {
          $(this).popover('show');
      };
      var hidePopover = function() {
          $(this).popover('hide');
      };
      $("[data-rel='tooltip']").popover({
          trigger: 'manual'
      }).click(showPopover).hover(showPopover, hidePopover);

  });