1

私は非常に軽い「ツールチップ」jQuery プラグインに取り組んでいます。以下はコードです：

(function( $ ) {
  $.fn.tooltip = function() {

    return this.each(function(){

        var target = $(this);

        target.on("mouseover", function(event){
            var tooltip = $(document.createElement("div"));
            tooltip
                .html(target.attr("tooltip-text"))
                .addClass("tooltip")
                .css({
                     "top" : event.pageY, 
                     "left":event.pageX 
                     })
                .fadeIn(300);                               
        }); 

    });

  };
})( jQuery );

そして、私はそれを次のように適用します：

<script>
    $("div.product").tooltip();
</script>

アイデアは、ユーザーが DIV をカーソルの横に置いたときにツールチップを表示することです。ただし、そのような DIV (クラス "product") にカーソルを合わせると、スクリプトは.addClass("tooltip")行でクラッシュします。

キャッチされていない TypeError: オブジェクトにメソッド 'addClass' がありません

私が間違っているのは何ですか？

4

2 に答える 2

1

これは、属性tooltip-textを割り当てているためです。

  .html(target.attr("tooltip-text"))

属性は未定義であるため、jQueryイベントの連鎖を台無しにします。これを試してみてください：

  .html(target.attr("tooltip-text") || "")

また、実行をwindow.onloadに固定する必要はありません。これを標準のドキュメントに入れておくと、問題なく機能します。

于 2012-09-11T19:18:16.890 に答える
0

Do not know why but use

.attr("style", tooltip.attr("style") + " tooltip")

instead of .addClass.

Hope this helps.

于 2012-09-11T19:04:14.610 に答える