加载 jQuery UI 的脚本标签依赖于在加载 jQuery UI 脚本之前运行 jQuery 的脚本标签中的 JavaScript 。如果您defer
在 jQuery 脚本标签上使用该属性,则会引入竞争条件,最终可能会导致 jQuery UI 首先加载并失败(而不是添加tabs
到jQuery.fn
)。因此,使用该tabs
函数的代码是否在ready
回调中并不重要。
您根本不需要使用defer
,因此我建议不要使用defer
和发布有关您的原始问题的问题,而不是尝试解决此问题,因为添加defer
不应该是解决方案。
但是,如果您想继续使用defer
,请删除您的 jQuery UI 脚本标签,并将其放在页面底部,就在结束</body>
标签之前:
<script>
(function() {
var waitingForUI = false;
loadScripts();
function loadScripts() {
if (window.jQuery && window.jQuery.fn.tabs) {
// Both jQuery and jQuery UI are loaded.
// ==> your code using `tabs` here <==
}
else {
if (window.jQuery) {
// jQuery is loaded but not jQuery UI, go get it
// unless we've already started loading it
if (!waitingForUI) {
waitingForUI = true;
jQuery.getScript("/your/path/to/jquery/ui");
}
}
setTimeout(loadScripts, 10);
}
}
})();
</script>
</body>
这将等待 jQuery 被加载,然后加载 jQuery UI 脚本,然后触发您的代码。
或者,当然,只需创建您自己的包含 jQuery 和 jQuery UI 的脚本文件,然后使用您的代码tabs
,然后加载该文件。