内联工具提示注释而不是文档就绪?

时间:2016-04-07 13:52:05

标签: javascript jquery

我有一个页面加载超过300个工具提示,每个工具提示大约1000个字符。 jQuery UI正在完成创建这些div元素的所有工作。我想知道我是否可以内联构建它们并隐藏它们,以加速片段缓存,然后只将处理程序附加到从缓存中读取的元素。

这是用于创建和处理工具提示的相当简单的JS代码。

  $(function() {
    $(document).tooltip({
      tooltipClass: "notes",
      content: function (callback) {
        callback($(this).prop('title'));
      }      
    });
  });

简化的视图代码,它将工具提示的注释加载到可排序容器的title属性中。

.portlet
  .portlet-header
    # Some info
  .portlet-content(title="#{ t.notes if t.notes }")
    # more info

如果JS在为每个.portlet元素提供基本信息后必须创建数百个弹出元素,片段缓存似乎没有帮助。我非常感谢你的帮助。谢谢。

1 个答案:

答案 0 :(得分:1)

如何即时创建工具提示,例如。使用悬停来调用将创建工具提示的函数。

假设所有需要悬停的元素都有类portlet-content,这里有一些东西可以让你开始...尝试在函数中集成.tooltip。请参阅console.log以获取可以使用的元素。

$(function() {
    function doToolTip(e) {
        console.log("Event: ");
        console.log(e);
        console.log("Event target: ");
        console.log(e.target);
        console.log("Title of the target: " + e.target.title);
    }
    $(document).on("hover", ".portlet-content", doToolTip);
});