为什么这段代码不起作用（以及如何修复它）？

此问题是another question of mine的后果。为什么这段代码不起作用（以及如何修复它）？

的代码是：

<script type='text/javascript'> 
    var scripts = [ 
     "http://www.---.com/include/jquery-1.8.3.min.js", 
     "http://www.---.com/include/functions.js", 
     "http://www.---.com/include/myjs.js", 
     "http://www.---.com/include/plugins/bxslider/bxslider.js" 
    ]; 
    function downloadJSAtOnload() { 
     for(var i=0; i<scripts.length; i++) { 
      var element = document.createElement('script'); 
      element.src = scripts[i]; 
      document.body.appendChild(element); 
     } 
     $(document).ready(function(){ 
      $('#mainslide .bxslider').bxSlider({ 
       slideWidth: '960', 
       mode: 'vertical', 
       speed: '500', 
       captions: false, 
       pager: false, 
       controls: false, 
       nextText: 'Next', 
       prevText: 'Prev', 
       auto: true, 
       autoHover: true, 
       pause: 3000 
      }); 
     }); 
    } 
    if (window.addEventListener) window.addEventListener('load', downloadJSAtOnload, false); 
    else if (window.attachEvent) window.attachEvent('onload', downloadJSAtOnload); 
    else window.onload = downloadJSAtOnload; 
</script>

产生的误差为“未捕获的ReferenceError：$没有定义”。

奇怪的是，在许多浏览器和版本中，一切都很完美（幻灯片，灯箱......）。仅在IE8和Safari 4中向用户显示警报。

来源

2013-04-11 Marco Panichi

也许它们太慢了，以至于在脚本元素被创建到第一个$之前实际加载jquery文件呢？为什么不直接在脚本标签中声明它们呢？ – 2013-04-11 12:50:21

你正在异步加载脚本......在执行'$'调用的时候，没有办法装载jQuery。 – 2013-04-11 12:50:49

在您尝试访问'$'时，脚本（包括jQuery）尚未加载。 – 2013-04-11 12:50:49

这些浏览器很可能在body在创建script元素后，他们到达第一$之前实际加载jQuery的文件太慢。

为什么不在您的文档的head中的script标签中声明它们？

来源

2013-04-11 12:52:44

*“那些浏览器可能太慢了”*：它与浏览器速度无关。即使脚本会立即加载，它们也不会被评估，直到当前的脚本执行结束。 JavaScript是单线程的，引擎不会停止当前正在运行的执行（以执行其他代码）。 – 2013-04-11 12:54:51

@FelixKling Well OP报告说它可以在其他浏览器中使用。也许你对'评估'的评论在不同的实现之间是不同的 - 事实上，所有需要的是当JS函数被调用时它们是可用的吗？ – 2013-04-11 12:56:28

我不知道。我无法想象这个代码如何在任何浏览器中工作，除非jQuery以任何其他方式（事先）包含在其中，出于某种原因，它在IE和Safari中失败。 – 2013-04-11 12:58:24

您将您的脚本添加到文档主体（它们应该真的在头部），但不要等待它们下载并执行之前访问jQuery $(document).ready(...)，所以我期望这至少会失败一些时间。您需要在不使用jQuery的情况下附加到文档onready事件。

来源

2013-04-11 12:53:00

单独的进口jquery的例子

<script src="http://www.---.com/include/jquery-1.8.3.min.js"> </ script>

来源

2013-04-11 12:57:27

在制作任何代码之前导入jquery – 2013-04-11 12:58:12

你既然是动态添加JS库文件，你会需要一个回调函数的脚本，以初始化加载bxSlider后。理想情况下，回调应在bxSlider加载后调用。

element.setAttribute("type","text/javascript"); 
element.onload = callBackFunction; 
document.body.appendChild(element); 

var callBackFunction() { 
      $('#mainslide .bxslider').bxSlider({ 
       slideWidth: '960', 
       mode: 'vertical', 
       speed: '500', 
       captions: false, 
       pager: false, 
       controls: false, 
       nextText: 'Next', 
       prevText: 'Prev', 
       auto: true, 
       autoHover: true, 
       pause: 3000 
      }); 
}

来源

2013-04-11 13:00:16

我不认为脚本必须按顺序加载。您必须监听每个脚本，并在所有脚本都加载后运行回调。 – 2013-04-11 13:01:22

非常感谢您的回答Mahesh，我会尽力使您的代码适应我的需求 – 2013-04-11 19:29:50

将函数从document.ready（）中取出并添加到jQuery.js文件的末尾。这样它只会在jQuery加载后运行。

来源

2013-08-13 18:45:23 bobs12

为什么这段代码不起作用（以及如何修复它）？

回答

相关问题