Question

考虑以下html头javacsript和css referecnes：

<link rel="stylesheet" href="/css/stylesheet.css" type="text/css" />
<link rel="stylesheet" href="/css/jquery-ui.css" type="text/css">

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

<script type="text/javascript" src="/js/fadeslideshow.js"></script>

<script>
$(function(){
     $('#datepicker').datepicker({dateFormat:'DD dd/mm/yy',showAnim: 'slide'});

     $("#anim").change(function(){
          $("#datepicker").datepicker("option","showAnim",$(this).val());
     }); 

});
</script>

上述日期选择器不起作用，但这样做：

<link rel="stylesheet" href="/css/stylesheet.css" type="text/css" />
<link rel="stylesheet" href="/css/jquery-ui.css" type="text/css">

<script type="text/javascript" src="/js/fadeslideshow.js"></script>

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

<script>
$(function(){
     $('#datepicker').datepicker({dateFormat:'DD dd/mm/yy',showAnim: 'slide'});

     $("#anim").change(function(){
          $("#datepicker").datepicker("option","showAnim",$(this).val());
     }); 

});
</script>

因此，如果我将referencve'fadeslideshow.js'置于主jquery库和ui文件的引用之上。类似的，如果我注释掉fadeslideshow.js引用，则datepicker将起作用。

为什么会出现这种情况，我花了一个多小时才弄明白为什么datepciekr没有工作？

谢谢，

艾伦。

Answer 1

因为浏览器在加载后会立即评估Javascript文件。 fadeslideshow.js依赖于jQuery或jQuery UI。它将尝试引用一个不存在的对象，根据脚本的功能，它可以将变量设置为与jQuery UI的datepicker不兼容的状态。

Answer 2

通过添加对旧版jquery的引用来修复，fadeslideshow.js显然必须依赖于：

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

Javascript html标头奇怪的行为

2 个答案: