getScript – 如何调用，如果尚未调用
在点击上，以下内容被加载：
$.getScript('/javascripts/contacts.js'); 我怎么写一个说的话
如果上面的getScript已经加载了X，如果没有加载它，请做Y …？
谢谢
var gotContacts = 0; function getContacts(){ if (!gotContacts){ $.getScript('/javascripts/contacts.js', function() { gotContacts = 1; doSomethingWithContacts(); }); }else{ doSomethingWithContacts(); } }
我的情况不同了。 我使用菜单使用jquery将内容加载到div中。 为了防止在标题部分中出现太多脚本，我使用.getscript仅在调用该链接时才加载文件。 这是我提出的防止重复的解决方案：
首先，我创建一个负责加载脚本的函数。 这是我网站上global.js文件的一部分，global.js文件被硬编码到标题中：
var loadedScripts=new Array(); function loadScriptFiles(scriptArray){ if($.isArray(scriptArray)){ $.each(scriptArray, function(intIndex, objValue){ if($.inArray(objValue, loadedScripts) < 0){ $.getScript(objValue, function(){ loadedScripts.push(objValue); }); } }); } else{ if($.inArray(script, loadedScripts) < 0){ $.getScript(script, function(){ loadedScripts.push(objValue); }); } } }
这需要两种类型的加载，可以是数组，也可以是单个脚本值。 如果它是一个数组，它会循环遍历每个元素并加载它。 如果它不是一个数组，那么它只会加载一个文件。 你会在一分钟内看到那部分。
重要部分：请参阅我在全局范围内（函数外部）创建了一个名为loadedScripts的数组。 因为这是global.js文件的一部分，所以它永远不会重新加载，可以从任何地方调用。 但是出于我们的目的，我只是检查要加载的脚本名称是否已经在数组中使用：
if($.inArray(objValue, loadedScripts) < 0){
因为如果找不到值，jquery inarray函数返回-1，我只会在值小于0时继续。其他任何意味着值都在数组中。
以下是调用要使用的函数的方法。 将此代码放在将被调用的动态页面的任何位置（我将其放在顶部）。
如果操作正确，您会发现它只会加载一次。
我创建了一个几乎完全符合你想要的插件 ： $.getScriptOnce() 。
如果您尝试加载两次或更多相同的脚本，它将不会加载脚本并返回false。
但基本上，它定义了$.getScript()替代函数
(function($) { $.getScriptOnce = function(url, successhandler) { if ($.getScriptOnce.loaded.indexOf(url) === -1) { $.getScriptOnce.loaded.push(url); if (successhandler === undefined) { return $.getScript(url); } else { return $.getScript(url, function(script, textStatus, jqXHR) { successhandler(script, textStatus, jqXHR); }); } } else { return false; } }; $.getScriptOnce.loaded = []; }(jQuery));
然后只需调用$.getScriptOnce('yourFile.js')
使用require.js
我也写了这样的function。 您可以使用Firebug或Chrome开发工具中的“ 网络”选项卡进行测试。 这只会加载同一个文件一次。
注意不要在上一次之后立即下载第二次，因为该函数只是假定文件已加载，在调用回调后，即文件加载成功后。
var getScriptOnce = (function(url, callback) { var scriptArray = []; //array of urls return function (url, callback) { //the global array doesn't have such url if (scriptArray.indexOf(url) === -1){ if (typeof callback === 'function') { return $.getScript(url, function(script, textStatus, jqXHR) { scriptArray.push(url); callback(script, textStatus, jqXHR); }); } else { return $.getScript(url, function(){ scriptArray.push(url); }); } } //the file is already there, it does nothing //to support as of jQuery 1.5 methods .done().fail() else{ return { done: function () { return { fail: function () {} }; } }; } } }()); /*#####################################################################*/ /*#####################################################################*/ //TEST - tries to load the same jQuery file twice var jQueryURL = "https://code.jquery.com/jquery-3.2.1.js"; console.log("Tries to load #1"); getScriptOnce(jQueryURL, function(){ console.log("Loaded successfully #1") }); //waits 2 seconds and tries to load again window.setTimeout(function(){ console.log("Tries to load #2"); getScriptOnce(jQueryURL, function(){ console.log("Loaded successfully #2"); }); }, 2000);
$.getScript( "https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js") .done(function () { alert('is called'); }) `.fail(function () { alert('is not called'); });
不要这样做; 不要将标记视为加载源代码的编译器。 相反，使用javascript minifier将所有源代码连接在一起，只打一次服务器。
加载一个4k文件比加载四个1k文件更好，并且minifier可能比这更好。 你无论如何都不需要它 - 你的浏览器无论如何都要缓存这些模块，除非你弄乱你的服务器配置，否则它会做正确的事情。
如果您真的想继续，请首先查看需求加载的JavaScript库，如Ensure ， Ajile或Dojo或JSAN 。 至少那时，你不是在重新发明轮子。
还想自己做吗？ 您可以检查contacts.js执行的操作，也可以使用变量来测试您是否已完成此操作。 如果contacts.js包含类似的内容：
function ContactsLoaded(){...}
你可以做：
if(typeof ContactsLoaded=='undefined')$.getScript('contacts.js');
或者，您可以自己设置并创建一个加载器function：
function getScriptOnce(f){ var a=getScriptOnce; if(typeof a[f]=='undefined')$.getScript(f); a[f]=true; }