Question

我有此功能可用于提示（正常工作）：

$('.tooltip').jBox('Tooltip', {
   closeOnMouseleave: true,
   ajax: {
      url: 'tooltips/tooltip.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true
   }
});

然后我具有用于每十秒钟加载div内容的功能（正常工作）：

$('#responsecontainer').load('live.jsp');
   var refreshId = setInterval(function() {
      $('#responsecontainer').load('live.jsp');
      }, 30000);
   $.ajaxSetup({ cache: false });
} );

除了在动态加载的div中，该链接在任何地方都可以正常工作。

<a class="tooltip" data-ajax="id=5" href="tooltip.html"Link</a>

在动态加载的div的竞争中，有人知道如何使此链接起作用吗？非常感谢

Answer 1

jBox带有attach（）方法：https://stephanwagner.me/jBox/methods#attaching-jbox

您应该使用此方法附加jBox并将jBox放在变量中：

var myJBox = new jBox('Tooltip', {
   closeOnMouseleave: true,
   attach: '.tooltip',
   ajax: {
      url: 'tooltips/tooltip.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true
   }
});

然后您可以随时使用myJBox.attach()重新连接jBox：

$('#responsecontainer').load('live.jsp', function () { myJBox.attach(); });
   var refreshId = setInterval(function() {
      $('#responsecontainer').load('live.jsp', function () { myJBox.attach(); });
   }, 30000);
   $.ajaxSetup({ cache: false });
} );

这样，您可以确保jBox不会多次将自身附加到元素上。

Answer 2

随着DOM内容的更改，您将需要重新应用工具提示。创建一个函数

fn:tokenize(fn:normalize-space($input), ' '))

在JQuery加载回调上调用函数

function applyTooltip () {
$('.tooltip').jBox('Tooltip', {
   closeOnMouseleave: true,
   ajax: {
      url: 'tooltips/tooltip.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true
   }
});

}

动态加载的div内容中的jQuery工具提示

2 个答案: