2

jquerytoolsのツールチッププラグイン（http://jquerytools.org/documentation/tooltip/index.html）を使用します。動的にロードされた要素にバインドする方法がわかりません。

私がそれを使用する「通常の」方法は次のとおりです。

$(".myElementClass").tooltip({ 
  effect: 'slide',
  tip: '#myTipId',
  offset: [40, 0],
  relative: true,
  position: 'top center'
})

ただし、.myElementClassがajaxによってロードされる場合、これは機能しません。動的にロードされる要素では、次のように「on」sintaxを使用します。

$(document).on("hover", ".myElement",function(){
  ...do something ...     
})

2つをどのように組み合わせる必要がありますか？

トリスタンの正解の後に編集：

$(document).on("hover", ".myElementClass",function(){
    tooltip=$(this).tooltip({
            effect: 'slide',
            tip: '#myTipId',
            offset: [40, 0],
            relative: true,
            position: 'top center',
            api:true
        });
        tooltip.show();
    })
4

1 に答える 1

1 
<script type="text/javascript">
  $(function() {
     $("input[type=button]").click(function() {
        $(".output").append("<div class='added' style='background-color:red;'>Hover Me , You will get tooltip</div>");
     });
     var tooltip = null;
     $(".output").on("hover", ".added", function () {
        if (tooltip == null) {
           tooltip = $(this).tooltip({
              effect: "slide",
              tip: "#myTipId",
              offset: [40, 0],
              relative: true,
              position: "top center",
              api:true
           });
        }
        tooltip.show();
     });
  });


<body>
   <div id="myTipId" style="display:none;">I'm tooltip</div>
   <input type="button" value="Add new Item" />
   <div class="output" style="border:1px solid black;"></div>
</body>

説明：config.api=trueを設定します。その場合、fn.tooltip（conf）は、ターゲットHTML要素自体ではなくtaketipオブジェクトを返します。ソースコードを参照してくださいhttps://github.com/jquerytools/jquerytools/blob/master/src/tooltip/tooltip.js＃352

于 2013-01-06T02:12:16.433 に答える