Javascript 如果尚未加载脚本,请加载脚本,然后使用它们

Javascript 如果尚未加载脚本,请加载脚本,然后使用它们,javascript,jquery,onload,Javascript,Jquery,Onload,如果尚未加载,我有4个javascript库要加载。然后,我想使用它们的函数 我的问题是我得到了未捕获的引用错误:sbjs没有定义,脚本被加载,但我不能实际使用它们 如果脚本尚未加载,我会将它们添加到标记上方,但我似乎无法让它们正常工作 这是我的密码: <script> window.onload = myapp_scripts; function myapp_scripts () { var myapp_script; if (!wind

如果尚未加载,我有4个javascript库要加载。然后,我想使用它们的函数

我的问题是我得到了
未捕获的引用错误:sbjs没有定义
,脚本被加载,但我不能实际使用它们

如果脚本尚未加载,我会将它们添加到
标记上方,但我似乎无法让它们正常工作

这是我的密码:

<script>
    window.onload = myapp_scripts;

    function myapp_scripts () {
      var myapp_script;

      if (!window.jQuery) {
        myapp_script = document.createElement('script');
        document.body.appendChild(myapp_script);
        myapp_script.src = 'http://myapp.dev/js/jquery.min.js';
        console.log('load jquery');
      }
      if (!window.Cookies) {
        myapp_script = document.createElement('script');
        document.body.appendChild(myapp_script);
        myapp_script.src = 'http://myapp.dev/js/cookie.min.js';
        console.log('load cookies');
      }
      if (typeof url == 'undefined') {
        myapp_script = document.createElement('script');
        document.body.appendChild(myapp_script);
        myapp_script.src = 'http://myapp.dev/js/url.min.js';
        console.log('load url');
      }
      if (typeof sbjs == 'undefined') {
        myapp_script = document.createElement('script');
        document.body.appendChild(myapp_script);
        myapp_script.src = 'http://myapp.dev/js/sourcebuster.min.js';
        console.log('load sbjs');
      }

      myapp_init();
    }

    function myapp_init () {
        sbjs.init();

        console.log(Cookies.get('source_id'));
        console.log(url('source_id'));
        console.log(sbjs.get.current);

        $('#myapp_form').submit(function (event) {
            event.preventDefault();
            console.log('form submitted');
        });
    }
</script>

window.onload=myapp\u脚本;
函数myapp_脚本(){
var-myapp_脚本;
如果(!window.jQuery){
myapp_script=document.createElement('script');
document.body.appendChild(myapp_脚本);
myapp_script.src='1http://myapp.dev/js/jquery.min.js';
log('loadjquery');
}
如果(!window.Cookies){
myapp_script=document.createElement('script');
document.body.appendChild(myapp_脚本);
myapp_script.src='1http://myapp.dev/js/cookie.min.js';
log(“加载cookies”);
}
如果(url的类型=='undefined'){
myapp_script=document.createElement('script');
document.body.appendChild(myapp_脚本);
myapp_script.src='1http://myapp.dev/js/url.min.js';
log('load url');
}
如果(类型sbjs==“未定义”){
myapp_script=document.createElement('script');
document.body.appendChild(myapp_脚本);
myapp_script.src='1http://myapp.dev/js/sourcebuster.min.js';
log('loadsbjs');
}
myapp_init();
}
函数myapp_init(){
sbjs.init();
console.log(Cookies.get('source_id'));
log(url('source_id'));
log(sbjs.get.current);
$(“#myapp_表单”)。提交(函数(事件){
event.preventDefault();
console.log(“提交的表单”);
});
}

如何使其也可以使用动态加载的脚本?

我认为您的问题是因为myapp_init()是在加载脚本之前执行的 您需要管理脚本加载事件和调用myapp_init()后

有些条件在每个if()条件中都是这样的:

var myapp_script;

var scripts_loaded = 0;

  if (!window.jQuery) {
    myapp_script = document.createElement('script');
    document.body.appendChild(myapp_script);
    myapp_script.src = 'http://myapp.dev/js/jquery.min.js';
    console.log('load jquery');

    myapp_script.onload = function(){
        scripts_loaded ++;
        if(scripts_loaded === 4){ //4 because in your example you have 4 scripts to load
           myapp_init();
        }  
    }

  }else{
     scripts_loaded ++;
  }
//...
//And so on with others if conditions

这不是一个优雅的解决方案,但只是其中一个想法:以某种方式检查是否加载了所有脚本,然后调用myapp_init()

可能的复制品比那更复杂。您只能在加载脚本后使用它们,您肯定知道在每个
createElement
脚本的
onload
函数中都会发生这种情况。为什么不直接加载它们呢?这是错误的哪一部分?这里的某处
sbjs.init()
if(typeof sbjs==“undefined”)
这是我为CRM创建的表单生成器。基本上,如果脚本尚未出现在客户端网站上,我希望加载脚本。客户的网站各不相同,在他们将表单放到网站上之前,我无法查看他们的代码。承诺的良好用例你有理由。但这是我第一次想到解释这个想法