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（类“产品”）时，脚本会在.addClass("tooltip")行崩溃：

未捕获的类型错误：对象没有方法“addClass”

我做错了什么？

4

2 回答 2

1

这是因为您正在分配属性工具提示文本：

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

该属性是未定义的，因此它会破坏 jQuery 事件的链接。尝试这样做：

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

您也不需要在 window.onload 中执行，将其放入准备好的标准文档中就可以了。

于 2012-09-11T19:18:16.890 回答
0

不知道为什么但使用

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

而不是 .addClass。

希望这可以帮助。

于 2012-09-11T19:04:14.610 回答