jQuery 插件 Tooltipster 为 ajax 调用加载内容提供错误
jQuery plugin Tooltipster giving error for ajax call to load conent
我有如下代码,错误来自 instance.content() 行。我正在动态加载所有内容并在下面为所有 href 标签执行。
错误是
未捕获的类型错误:instance.content 不是函数
我该如何解决这个问题
ex.find("a[href]").each(function (idx, el) {
var el = $(el);
var url = el.prop("href").substring(4);
el.attr("href", "");
el.addClass("popuplink");
el.tooltipster({
content: 'Loading...',
// 'instance' is basically the tooltip. More details in the "Object-oriented Tooltipster" section.
functionBefore: function (instance, helper) {
var $origin = $(helper.origin);
// we set a variable so the data is only loaded once via Ajax, not every time the tooltip opens
if ($origin.data('loaded') !== true) {
$.get(url, function (data) {
// call the 'content' method to update the content of our tooltip with the returned data
instance.content(data);
// to remember that the data has been loaded
$origin.data('loaded', true);
});
}
}
});
});
确保您使用的是 Tooltipster v4 的文件。我看不出有其他原因无法使用您提供给我们的代码。
如果其他人遇到 V3 的这个问题并希望它适用于 V3 而不是 V4,您可以在此处查看旧文档:
https://web.archive.org/web/20140404021936/http://iamceege.github.io/tooltipster#advanced
基本上他们真的改变了函数在版本之间的工作方式,所以很混乱。一个有效的 V3 示例可能是:
$('.tooltip').tooltipster({
content: 'Loading...',
functionBefore: function(origin, continueTooltip) {
// we'll make this function asynchronous and allow the tooltip to go ahead and show the loading notification while fetching our data
continueTooltip();
// next, we want to check if our data has already been cached
if (origin.data('ajax') !== 'cached') {
$.ajax({
type: 'POST',
url: 'example.php',
success: function(data) {
// update our tooltip content with our returned data and cache it
origin.tooltipster('content', data).data('ajax', 'cached');
}
});
}
}
});
我有如下代码,错误来自 instance.content() 行。我正在动态加载所有内容并在下面为所有 href 标签执行。 错误是 未捕获的类型错误:instance.content 不是函数 我该如何解决这个问题
ex.find("a[href]").each(function (idx, el) {
var el = $(el);
var url = el.prop("href").substring(4);
el.attr("href", "");
el.addClass("popuplink");
el.tooltipster({
content: 'Loading...',
// 'instance' is basically the tooltip. More details in the "Object-oriented Tooltipster" section.
functionBefore: function (instance, helper) {
var $origin = $(helper.origin);
// we set a variable so the data is only loaded once via Ajax, not every time the tooltip opens
if ($origin.data('loaded') !== true) {
$.get(url, function (data) {
// call the 'content' method to update the content of our tooltip with the returned data
instance.content(data);
// to remember that the data has been loaded
$origin.data('loaded', true);
});
}
}
});
});
确保您使用的是 Tooltipster v4 的文件。我看不出有其他原因无法使用您提供给我们的代码。
如果其他人遇到 V3 的这个问题并希望它适用于 V3 而不是 V4,您可以在此处查看旧文档:
https://web.archive.org/web/20140404021936/http://iamceege.github.io/tooltipster#advanced
基本上他们真的改变了函数在版本之间的工作方式,所以很混乱。一个有效的 V3 示例可能是:
$('.tooltip').tooltipster({
content: 'Loading...',
functionBefore: function(origin, continueTooltip) {
// we'll make this function asynchronous and allow the tooltip to go ahead and show the loading notification while fetching our data
continueTooltip();
// next, we want to check if our data has already been cached
if (origin.data('ajax') !== 'cached') {
$.ajax({
type: 'POST',
url: 'example.php',
success: function(data) {
// update our tooltip content with our returned data and cache it
origin.tooltipster('content', data).data('ajax', 'cached');
}
});
}
}
});