3

我的具体用例是我使用 .net 回发来显示一个更新面板，其中包含与它们相关联的工具提示的元素。我已经在页面上初始化了 ZURB Foundation（提供工具提示）脚本，第一页的工具提示效果很好。回发后，我想*重新*初始化脚本，以便将这些新的工具提示项绑定到“悬停”事件。

通用用例是以任何方式添加启用工具提示的新元素的任何情况。

在我看来，“悬停”绑定是在页面初始化到现有的“.has-tip”元素集合时完成的，但是正在处理未来的.has-tip 元素的存在。

我想做以下事情： a) 重新初始化工具提示插件并搜索新的 .has-tip 元素以附加“悬停”事件。

已经尝试了许多不同的方法来尝试重新初始化，但是 

$.fn.tooltips('init');

似乎是最有希望的，因为它成功调用了脚本中的 init 方法，但没有将悬停事件绑定到新的 .has-tip 元素。

4

3 回答 3

1

我尝试了很多建议，但真正有效的是：

完成 DOM 编辑后，您必须调用

$(document).foundation();

这句话将刷新所有内容，包括您的工具提示。奇迹般有效。

于 2014-09-01T16:31:06.093 回答
1

编辑/澄清：

  1. 似乎存在动态内容的错误： https ://github.com/zurb/foundation/pull/465

  2. 修复错误后（您可以自己修复，阅读请求请求以获取更多信息），错误已修复，因此您可以触发页面范围的工具提示刷新：

    $(document).tooltips('reload');

原始答案

如果您还没有弄清楚，jquery.tooltips.js 有一个名为 .reload 的方法/函数，它实际上似乎是最有前途的（代码来自基础插件）：

reload : function() {
      var $self = $(this);
      return ($self.data('tooltips')) ? $self.tooltips('destroy').tooltips('init') : $self.tooltips('init');
    },

这实际上只是他们其他方法的链，但最好在 .init 之前 .destroy 以避免双重工具提示或其他一些冲突。

于 2012-05-07T15:42:29.137 回答
0

当使用 Ajax 生成模态窗口时，我遇到了同样的问题，

这是我的解决方法：

$(document)
  .on('opened.fndtn.reveal', '[data-reveal]', function () {
    $('html').css({'overflow': 'hidden'});
    $('.has-tip').each(function(i){
    var tip = $(this);
    Foundation.libs.tooltip.create(tip);
  });
})

它适用于 ZF v5.2+

于 2015-02-12T14:09:32.017 回答