Question

我正在开发一个项目，为现有的强制门户提供facebook身份验证。这个强制性门户网站有一个自定义模板的选项，所以......我可以编辑html代码来显示我自己的模板。

问题在于，每次我在模板上导入脚本时都会出现这种情况

<script src="external http or https script"></script>

它失败了，结果是一个空白页面，没有从模板中加载任何东西......

我已经在页面加载后导入脚本找到了解决方案....

var script=document.createElement('script');
script.src="http://code.jquery.com/jquery-latest.min.js";
var head=document.getElementsByTagName('head')[0]
head.appendChild(script);

它正在工作......我可以在控制台上确认调用$（'body'）例如返回html的body元素..所以jquery准备就绪......

我的问题：如果在加载jquery ussing the workaraound之后加载其他脚本（在这种情况下为angular和socket.io），这些脚本会因jquery问题而失败

Uncaught ReferenceError: $ is not defined

我的问题：如何在jquery完成加载后加载这些脚本... 我是否需要初始化jquery如何使用它？

提前致谢

完整代码

 <html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="expires" content="-1"/>
</head>
<body onload="initialFunction()">
<script>
function initialFunction(){
    document.getElementsByName('username')[0].placeholder="Nombre de Usuario"
    document.getElementsByName('password')[0].placeholder="Contraseña"
    var script=document.createElement('script');
    var angularScript=document.createElement('script');
    var socketScript=document.createElement('script');
    var angularFacebookScript=document.createElement('script');
    var appScript=document.createElement('script');
    var materializeScript=document.createElement('script');
    script.src="http://code.jquery.com/jquery-latest.min.js";
    angularScript.src="http://192.168.1.5/js/angular.js";
    socketScript.src="http://192.168.1.5:8080/socket.io/socket.io.js"
    angularFacebookScript.src="http://192.168.1.5/angular-facebook-master/lib/angular-facebook.js"
    appScript.src="http://192.168.1.5/js/app.js"
    materializeScript.src="http://192.168.1.5/js/materialize.min.js"
    var head=document.getElementsByTagName('head')[0]
    var body=document.getElementsByTagName('body')[0]
    head.appendChild(script);
    body.appendChild(angularScript);
    body.appendChild(socketScript);
    body.appendChild(angularFacebookScript);
    body.appendChild(appScript);
    body.appendChild(materializeScript);
}
</script>
<center>
    <style>
        body {
        background-color:#298eea;
        }
        ....some other stuff...
    </style>
    <div>
        <h3>{company_logo}</h3>
        <h2>Captive Portal</h2>
        <div id="__loginbox"></div> 
        //here I want to insert the facebook button with an angular controller to pass info to a backend via socket io.... I have already do that before ussing the "normal way"
    </div>
</center>
</body></html>

Answer 1

尝试在onload变量

上使用script事件

script.onload = function() {
  console.log(jQuery().jquery);
  // do stuff with jQuery script
}

angularScript.onload = function() {
  // do stuff with angular script
}

类似于socketScript，angularFacebookScript，appScript，materializeScript

使用javascript函数

1 个答案: