js把script标签写入浏览器的问题
0
悬赏园豆：10
[已解决问题]
解决于 2014-10-22 17:18
在项目中实现登录时，从后台得到一个script标签：
<script type="text/javascript" src="http://bbs.test.com/api/uc.php?time=1413886242&code=80979ZMRma1bppLV0rjV1RohK%2BRdfrd15U4N840onBXUSpW81BpSI2yYFB743Nsht%2FIbrf9Z7z0GcuFT%2BUsq4hR5CgqOREF8tF3ztBAD2Cwzf4pougOF0eFYOGI2bvgfpezxFAbXSIBh5sm52ByWntWrT8aWjaBr8p0SiVMi" reload="1"></script><script type="text/javascript" src="http://test.test.com/api/uc.ashx?time=1413886242&code=34af0R6HAsjcq96ytMD%2B8tbQhy38%2B%2FoLp5GYmmsp%2BhyA9qGz8B6%2FdUWEGkTB10stAGHDdyJDGwE5YWnVytzV0BROrT4QqLqGrwtomGEc7119W6LIceoDq0D0%2FIH4zXQJRuBkLf5tG4XaE3dYQxQ7QkPdiKbKEihfWKjSuEz3" reload="1"></script>
我使用jQuery的appendTo方法把该标签写入document中：$(rdata.dataObj.discuzLogin).appendTo($(document));
（注：discuzLogin的值就是上面整个script标签的内容）
之后，会有一个弹窗：alert(rdata.errDesc);
最后，点击弹窗的确定之后，当前页面会跳转。我的问题是这样的，在网速不好的情况下，如果弹窗一出来就点击确定跳转页面，那么上面script标签的请求很有可能会被中断（IE下），导致浏览器没有向服务端发送这个的请求或者这个请求发送出去了但没有得到响应。但是，如果等一会儿到响应完成再点击确定进行跳转，那这个登录就没什么问题了。麻烦路过的大神给点提示，指教一下。非常感谢！
最佳答案
0
有没有考虑过，在加载script完成之前,给页面加一个遮罩层。
等待ajax的success事件被触发后，再去掉遮罩层。
一点浅见，希望对你有帮助。
http://www.cnblogs.com/qq-757617012/p/4038454.html
收获园豆：10
呃。。。我上面的代码本身是在ajax的success方法中。就是说在ajax执行完成后会得到一个返回值，这个返回值里面有上面整个的script标签这个字符串，然后我需要在success方法中实现加载这个script标签，最后再跳转页面。
@孤独旅者: jQuery.ajaxSetup() 设置
beforeSend:function(XMLHttpRequest){ console.log("开始ajax请求");
//添加你的遮罩层
}
@刘江龙: 我还是不太理解你说的添加遮罩层有什么用，不过这个问题我已经解决了，是根据你的提示用别的方法解决的，非常感谢你的回答！
@孤独旅者: 不客气，能告诉我你怎么解决的吗？写出大概思路1,2,3即可，谢谢！
@刘江龙: 我大概理解你添加遮罩层的用意了，但我不需要这个遮罩层。我需要的是浏览器把上面的script标签加载完毕后再alert提示，因为像上面直接放到浏览器上会导致不等到它加载完毕就alert了。我的做法是把上面script标签的src部分用正则给弄出来，然后分别加载。本来我想用jQuery的ajax方法来实现，但是没解决那个bbs.test.com跨域的问题，所以最后被舍弃了。我的做法是先把上面取出的src值放到一个队列中，然后让队列中的最后一个元素出队。根据这个src值使用js创建一个script标签并把它附加到head中，最重要的是要给这个script标签注册一个onload事件，在这个事件中判断队列中是否还有元素，如果有，就继续创建script标签并注册onload事件，否则就说明加载完毕。最后就可以alert了。下面是我实现的方法：
1 /* 2 加载script标签 3 urlArr：加载路径的队列 4 callback：回调函数 5 */ 6 var loadScript = function(urlArr, callback){ 7 if(urlArr && Object.prototype.toString.call(urlArr) === "[object Array]"){ 8 var src = urlArr.pop(); 9 var head = document.getElementsByTagName('head')[0]; 10 var script = document.createElement('script'); 11 script.type = 'text/javascript'; 12 script.src = src; 13 script.reload = 1; 14 //借鉴了jQuery的script跨域方法 15 script.onload = script.onreadystatechange = function(){ 16 if((!this.readyState||this.readyState === "loaded"||this.readyState === "complete")){ 17 //callback && callback(); 18 19 // Handle memory leak in IE 20 script.onload = script.onreadystatechange = null; 21 if(urlArr.length > 0){ 22 loadScript(urlArr, callback); 23 }else{ 24 if(typeof callback == 'function'){ 25 callback(); 26 } 27 } 28 } 29 }; 30 // Use insertBefore instead of appendChild to circumvent an IE6 bug. 31 head.insertBefore( script, head.firstChild); 32 33 } 34 }
