将工具提示行为分配给重复的链接

时间:2010-10-05 07:10:56

标签: jquery ajax dynamic tooltip repeat

下面的HTML是通过ajax调用“purchase_content”生成的。我想将工具提示应用于每行中的每个链接,最多可以有100行。

这是代码,但没有成功。如果我翻转每个链接两次工具提示出现但不会再出现。有关解决每一行链接的想法吗?

<div id="purchase_content">
  <div id="pr-listing">

  <div id="pr-odd">
    <table width="950" height="100" border="0" cellpadding="0" cellspacing="0">
      <tr><td width="75" align="center" valign="middle">
        <a href="#" id="avlink" title="3-5 Working Days">5-7 Days</a>
      </td></tr>
    </table>
  </div>

  <div id="pr-even">
    <table width="950" height="100" border="0" cellpadding="0" cellspacing="0">
      <tr><td width="75" align="center" valign="middle">
        <a href="#" class="avlink" title="3-5 Working Days">Available Now</a>
      </td></tr>
   </table>
  </div>

  </div>
</div>

$('a.avlink').live('mouseover', function(e) {
  var target = $(e.target);
  return $(target).tooltip({
    track: true,
    delay: 0,
    opacity: 0.9,
    showURL: false,
    showBody: " - ",
    extraClass: "pretty",
    fixPNG: true,
    left: -120
  });
});

2 个答案:

答案 0 :(得分:0)

在你的ajax成功处理程序中,尝试添加类似的东西,

$('a.avlink').not('.hasToolTip') // hasToolTip with a dot in it
.addClass('hasToolTip')   // hasToolTip without a dot in it
.tooltip({
    track: true,
    delay: 0,
    opacity: 0.9,
    showURL: false,
    showBody: " - ",
    extraClass: "pretty",
    fixPNG: true,
    left: -120
});

答案 1 :(得分:0)

我在&lt;中添加了一个id“pr-cell”。 td&gt;在每个链接之外并应用于所有&lt; a&gt;每个链接都带有唯一ID的标签,感谢您的帮助。

$('#pr-cell > a').live('mouseover', function(e) {
    $('#pr-cell > a').not('.hasToolTip')
    .addClass('hasToolTip')
    .tooltip({
        track: true,
        delay: 0,
        opacity: 0.9,
        showURL: false,
        showBody: " - ",
        extraClass: "pretty",
        fixPNG: true,
        left: -120
    });
});