等到 Jquery 库加载完毕后再执行外部 javascript 文件答案

【问题标题】：Wait until Jquery library has loaded before executing external javascript files等到 Jquery 库加载完毕后再执行外部 javascript 文件
【发布时间】：2013-10-24 10:39:45
【问题描述】：

有没有办法等到jquery库加载完毕，直到我们执行其他外部javascript文件，所以等待这个完全加载：

<script type="text/javascript"  src="jquery-1.7.2.js"></script>

然后加载其他文件如：

<script type="text/javascript"  src="campaign_winter_2013/bg_outerwear/js/main.js"></script>
<script type="text/javascript"  src="campaign_winter_2013/bg_outerwear/js/mousePosSlide.js"></script>

问题是我在平台中集成代码，并且 jquery 库在我的脚本之前加载。

【问题讨论】：

你的意思是加载后？
你可以让 jquery 加载到他的脚本中
通常只需先嵌入 jquery 脚本然后添加其他脚本就足够了。这是你的问题吗？
使用 require.js 对这个目的有好处requirejs.org
除非您使用异步或延迟，否则它会自动完成所有操作。也许你真正想做的是等待 DOM 准备好，如果是这样，那将是 jQuery 的文档准备方法？

标签： jquery

【解决方案1】：

您可以先加载 jquery 库，然后调用 JS 文件中定义的方法。以下代码对我有用。

<body> 

function loadJQuery(){

var waitForLoad = function () {
    if (typeof jQuery != "undefined") {
        console.log("jquery loaded..");
        // invoke any methods defined in your JS files to begin execution       
    } else {
        console.log("jquery not loaded..");
        window.setTimeout(waitForLoad, 500);
    }
 };
 window.setTimeout(waitForLoad, 500);   
}

window.onload = loadJQuery;

</body>

【讨论】：

【解决方案2】：

检查一下：

https://jsfiddle.net/neohunter/ey2pqt5z/

它会创建一个假的 jQuery 对象，允许你使用 jquery 的 onload 方法，它们会在 jquery 加载后立即执行。

这并不完美。

// This have to be on <HEAD> preferibly inline
var delayed_jquery = [];
jQuery = function() {
  if (typeof arguments[0] == "function") {
    jQuery(document).ready(arguments[0]);
  } else {
    return {
      ready: function(fn) {
        console.log("registering function");
        delayed_jquery.push(fn);
      }
    }
  }
};
$ = jQuery;
var waitForLoad = function() {
  if (typeof jQuery.fn != "undefined") {
    console.log("jquery loaded!!!");
    for (k in delayed_jquery) {
      delayed_jquery[k]();
    }
  } else {
    console.log("jquery not loaded..");
    window.setTimeout(waitForLoad, 500);
  }
};
window.setTimeout(waitForLoad, 500);
// end



// now lets use jQuery (the fake version)
jQuery(document).ready(function() {
  alert('Jquery now exists!');
});

jQuery(function() {
  alert('Jquery now exists, this is using an alternative call');
})

// And lets load the real jquery after 3 seconds..
window.setTimeout(function() {
  var newscript = document.createElement('script');
  newscript.type = 'text/javascript';
  newscript.async = true;
  newscript.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js';
  (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(newscript);
}, 3000);

【讨论】：