JavaScript 代码未执行

Question

我有一些 jQuery 代码没有被执行。代码块看起来像

jQuery(document).ready(function() {
$('#Start').datepicker();
$('#End').datepicker();
$('#End').val('date');
$('#Start').val('start');
alert('hello');
}); 

但它没有在 Start 和 End 文本框上应用日期选择器。请注意，在此脚本之前添加了 jQuery 和 jQuery.ui 文件。在这个代码块中，甚至最后一行 (alert) 都没有被执行。

我可以在 Firefox 控制台中看到显示为 uncaught exception: Invalid dimensions for plot, width = null, height = null 的错误，但它没有告诉我错误的位置。

可能是什么问题？为什么这段代码没有运行？如何调试？

编辑 1： 我已将代码更改为以下

jQuery(document).ready(function() {
        //$('#Start').datepicker();
        //$('#End').datepicker();
        //$('#End').val('date');
        //$('#Start').val('start');
        alert('hello inside');
    });
    alert("hello outside");

现在只有两个警报（其余行已注释），外部就绪函数执行警报，但内部没有执行。

Answer 1

使用日期选择器，我不确定您是否可以在初始化日期选择器后设置字符串值。

尝试删除这两行：

$('#End').val('date');
$('#Start').val('start');

Answer 2

我从未使用过 Datepicker，但我认为如果您将这些行注释掉，它将起作用：

$('#End').val('date');
$('#Start').val('start');

大部分 jquery 是异步的，即。上面的两行将在用户选择日期之前执行（因此缺少值）。所以你需要包含一个这样的回调函数（快速谷歌）

jQuery datepicker, onSelect won't work

    $('#End').datepicker( {
        onSelect: function(date) {
            alert(date);        }
    });

编辑：

这在 jsfiddle (http://jsfiddle.net/q6UFc/) 上对我有用：

HTML：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
<input type="text" id="end" name="end" />

Javascript：

$(document).ready(function () {          
$('#end').datepicker( {
            onSelect: function(date) {
                alert(date);        }
        });

})