jQuery DateTimePicker时间日期控件

在jquery ui里面有个控件DatePicker，只能选择日期。没有时间可以选择。我在这次项目中就遇到了要有日期也要时间一起显示的。在网上搜了一下找到了这个DateTimePicker时间日期控件。

他里面说的会有几个bug的。我在这里也说说吧。因为我也遇到了这样的问题的：

1.当输入框输入的时间是0时，控件会显示不完整，就是因为有一个函数有bug，如下所示：

在jquery-calendar.js文件里面修改。

trimNumber: function (value) {

if (value == '')

return '';

while (value.charAt( 0 ) == ' 0 ' ) {

value = value.substring( 1 );

}

return value;

},

while (value.charAt( 0 ) == ' 0 ' ) {

value = value.substring( 1 );

}

如果，这里是0的话始终会出错，因为他的长度最后是1,不能执行substring(1),改成下面的就好了：

trimNumber: function (value) {

if (value == '')

return '';

while (value.charAt( 0 ) == ' 0 ' && value.length >1 ) {

value = value.substring( 1 );

}

return value;

},

--------------------------------------------------------------------------------

2.原作者是在jquery1.1.2的版本下面实现的，在最新的版本是1.4.2，这控件在1.4.2的版本下会出现异常，不能选择日期，是因为有几个选择器有问题：(我看的原文章说的1.3.2的版本。我用的1.4.2的版本照着这个方法改了，同样可以实现)

同样也是在jquery-calendar.js文件里面修改：

1 $('.calendar_daysRow td[a]').hover( // highlight current day

2 function() {

3 $(this).addClass('calendar_daysCellOver');

4 }, function() {

5 $(this).removeClass('calendar_daysCellOver');

6 });

7 $('.calendar_daysRow td[a]').click(function() { // select day

8 popUpCal.selectedDay = $("a",this).html();

9 popUpCal.selectDate();

10 });

上面的$('.calendar_daysRow td[a]')在jQuery 1.3.2中不能使用，$("a",this)也是有问题的，同时，在FireFox中，<a>的不能设置背景颜色，所以hover函数不起作用，把它设在<td>也能达到相同的效果，改成以下代码即可：

1 //$('.calendar_daysRow td a').hover( // highlight current day

2 $('.calendar_daysRow td').hover( // highlight current day

3 function() {

4 $(this).addClass('calendar_daysCellOver');

5 }, function() {

6 $(this).removeClass('calendar_daysCellOver');

7 });

8 //$('.calendar_daysRow td[a]').click(function() { // select day

9 $('.calendar_daysRow td a').click(function() { // select day

10 //alert("click");

11 //popUpCal.selectedDay = $("a",this).html();

12 popUpCal.selectedDay = $(this).html();

13 popUpCal.selectDate();

14 });

--------------------------------------------------------------------------------

呃。。忘了说了。要导入jquery.js，jquery-calendar.js，jquery-calendar.css 文件来用的。

这里有一个原文章里面的示例可以参考一下：（http://razum.si/jQuery-calendar/TimeCalendar.html）

--------------------------------------------------------------------------------

3.我在单独的页面里面写了一个这个控件可以使用，而在我的项目里面弹出了一个层在层里面使用用不了。

原因是因为：

其实控件已经出来了的。只是被我弹出来的div给挡住了，才会显示看着没有出来效果。

修改了jquery-calendar.css文件里面的一个calendar_div这个样式里面的z-index的值大于弹出来的层的值就可以了。

4.修改格式：

在jquery-calendar.css文件里面有个dateFormat属性原来是mdy/显示出来就是mm/dd/yy 00:00:00AM

把他: 'YMD-',就成了mm-dd-yy 00:00:00AM 了。

http://hi.baidu.com/waterjiang/blog/item/87a9e10152aea26c3912bb1e.html