关于属性操作的jquery问题

我是jQuery的新手，我无法弄清楚我的问题的解决方案。我在我网站上的一些SVG对象上使用jQuery easytooltip。一切工作正常，但我需要改变运行时的工具提示的一些属性。我的document.ready功能是这样的：关于属性操作的jquery问题

$(document).ready(function() { 
    $("polygon").easyTooltip({ 
     tooltipId: "easyTooltip2", 
     content: 'hello' 
    }); 
});

我希望能够，（鼠标悬停在我的多边形）读出从我的多边形属性，然后传送到内容属性，它表明，当工具提示正在显示...如何访问内容值以在运行时更改它？

我的插件代码现在看起来是这样的：

(function ($) { 

$.fn.content = function (_content) { 

    $(this).easyToolTip({ content: _content }) 
}; 

$.fn.easyTooltip = function (options) { 

    // default configuration properties 
    var defaults = { 
     xOffset: 10, 
     yOffset: 25, 
     tooltipId: "easyTooltip", 
     clickRemove: false, 
     content: "", 
     useElement: "" 
    }; 


    var options = $.extend(defaults, options); 
    var content; 


    this.each(function() { 
     var title = $(this).attr("title"); 
     $(this).hover(function (e) { 
      content = (options.content != "") ? options.content : title; 
      content = (options.useElement != "") ? $("#" + options.useElement).html() : content; 
      $(this).attr("title", ""); 
      if (content != "" && content != undefined) { 
       $("body").append("<div id='" + options.tooltipId + "'>" + content + "</div>"); 
       $("#" + options.tooltipId) 
        .css("position", "absolute") 
        .css("top", (e.pageY - options.yOffset) + "px") 
        .css("left", (e.pageX + options.xOffset) + "px") 
        .css("display", "none") 
        .fadeIn("slow") 
      } 
     }, 
     function() { 
      $("#" + options.tooltipId).remove(); 
      $(this).attr("title", title); 
     }); 
     $(this).mousemove(function (e) { 
      $("#" + options.tooltipId) 
       .css("top", (e.pageY - options.yOffset) + "px") 
       .css("left", (e.pageX + options.xOffset) + "px") 
     }); 
     if (options.clickRemove) { 
      $(this).mousedown(function (e) { 
       $("#" + options.tooltipId).remove(); 
       $(this).attr("title", title); 
      }); 
     } 
    }); 

}; 

})(jQuery);

来源

2011-07-22 john

退房.live()：

$("polygon").live("mouseover", function() { 

    $("polygon").easyTooltip({ 
      tooltipId: "easyTooltip2", 
      content: 'hello' 
    }); 

});

More info。

来源

2011-07-22 09:41:49

谢谢你的兴趣。我已经在使用JavaScript编写的onmousover函数了。在这个函数中，我想我必须添加如下内容：$（“easyTooltip2”）。content =“changedContent”;这是否有可能？ – john

@Paperjam你应该使用鼠标悬停，而不是onmouseover –

@john这是可能的。你可以通过这样做来创建你自己的jQuery插件（http://docs.jquery.com/Plugins/Authoring）：'$ .fn.content = function（_content）{$（this）.easyToolTip（{content： _content}）}'。我没有机会测试这个，但我认为这可能会让你朝正确的方向发展。 –

你可以这样做：

$("polygon").mouseover(function() { 

    $("polygon").easyTooltip({ 
      tooltipId: "easyTooltip2", 
      content: 'changedContent' 
    }); 

});

这将重新创建工具提示：一个更好的选择是只修改的内容，我会考虑的API，看它是否是可能的。（这是不可能的，我认为插件提供的API，重新创建工具提示）

来源

2011-07-22 09:55:46

关于属性操作的jquery问题

回答

相关问题