jQuery的date/时间select器

我一直在寻找一个体面的jQuery插件,可以处理date和时间。 核心UI DatePicker很棒,但不幸的是我需要能够花时间。

我发现DatePicker的一些窍门可以和时间一起工作,但是它们看起来都很不雅,而且Google没什么好看的。

有一个很好的jQuery插件用于在具有可用接口的单个​​UI控件中selectdate和时间吗?

到目前为止最好和最简单的DateTimeselect器选项是http://trentrichardson.com/examples/timepicker/

它是jQuery UI Datepicker的扩展,因此它将支持相同的主题,它的工作方式也非常相似,类似的语法等。这应该与jQuery UI imo打包在一起。

@大卫,谢谢你的build议! @fluid_chelsea,我刚刚发布了使用jQuery而不是Prototype的Any + Time(TM)3.x版本,并且有一个非常好的界面,所以我希望它现在能满足你的需求:

http://www.ama3.com/anytime/

任何问题,请通过我的网站上的评论链接让我知道!

在我看来,date和时间应该作为两个单独的input框来处理,以使其对用户来说是最可用和高效的input。 让用户一次input一件东西是一个很好的原则,恕我直言。

我使用核心UI DatePicker ,以及下面的时间select器。

这一个灵感来自Google日历使用的一个:

jQuery timePicker
例子: http : //labs.perifer.se/timedatepicker/
在github上的项目: https : //github.com/perifer/timePicker

我发现它是所有替代品中最好的。 用户可以快速input,看起来干净,简单,并允许用户input特定的时间到分钟。

PS:在我看来:滑块(由一些替代的时间select器使用)需要太多的点击,并要求用户的鼠标精度(这使得input较慢)。

我用datepicker的最佳体验是基于原型的AnyTime 。 我知道这不是jQuery,但它可能仍然是值得妥协的。 我完全不知道原型,而且还很容易处理。

我发现一个警告:它在某些浏览器上不兼容。 也就是说,它不适用于Chrome上更新版本的原型。

只需要在这里添加信息,stream体项目有一个很好的维基书写在这里概述大量的date和/或时间select器。

我刚刚研究这个,还没有find一个体面的dateselect器,还包括一个体面的时间select器。 我最终使用的是eyecon的令人敬畏的DatePicker ,有两个简单的时间下拉菜单。 我很想用Timepickr.js ,看起来像一个非常好的方法。

我遇到了同样的问题。 我实际上开发了我使用的服务器端编程,但我做了一个快速search,试图帮助你,并发现这一点。

看起来好吧,没有太多看源码,但似乎是纯粹的JavaScript。

看看:

http://www.rainforestnet.com/datetimepicker/datetimepicker.htm

这里是演示页面的链接:

http://www.rainforestnet.com/datetimepicker/datetimepicker-demo.htm

祝你好运

这是我用一些代码让用户select一个datetimepicker,设置date时间,并让其他datetimepicker添加一分钟到那个时间。

我需要这个定制药物控制….

无论如何,认为这可能会帮助别人,因为我无法find答案任何在网上…

(至less不是完整的答案)

请记住,60000的增加,增加了一分钟。 (60 * 1000毫秒)

 $('.frdtPicker').datetimepicker({ onClose: function(dateText, inst) { var endDateTextBox = $('.todtPicker'); if (endDateTextBox.val() != '') { var testStartDate = new Date(dateText); var testEndDate = new Date(endDateTextBox.val()); if (testStartDate > testEndDate) { var testStartDate = new Date(dateText).getTime() + 60000; var testStartDate2 = new Date(testStartDate); endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2))); } } else { var testStartDate = new Date(dateText).getTime() + 60000; var testStartDate2 = new Date(testStartDate); endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2))); } $('.frdtPicker').val(dateText); //endDateTextBox.val()); }, onSelect: function(selectedDateTime) { var start = $(this).datetimepicker('getDate'); $('.todtPicker').datetimepicker('option', 'minDate', new Date(start.getTime())); } }); 

看看下面的JavaScript插件。

与date和时间的Javascript日历

我尽可能地简化了它。 但它还处于早期阶段。 让我知道的反馈,所以我可以改善它。

不是jQuery,但它适用于具有时间的日历: JavaScript Date Time Picker

我只是绑定点击事件popup:

 $(".arrival-date").click(function() { NewCssCal($(this).attr('id'), 'mmddyyyy', 'dropdown', true, 12); }); 

我做了这样一个function:

 function getTime() { var date_obj = new Date(); var date_obj_hours = date_obj.getHours(); var date_obj_mins = date_obj.getMinutes(); var date_obj_second = date_obj.getSeconds(); var date_obj_time = "'"+date_obj_hours+":"+date_obj_mins+":"+date_obj_second+"'"; return date_obj_time; } 

然后我使用这样的jQuery UIdateselect器:

 $("#selector").datepicker( "option", "dateFormat", "yy-mm-dd "+getTime()+"" ); 

所以,我得到这样的价值: 2010-10-31 12:41:57

我们遇到了麻烦,find了一个我们想要的方式,所以我写了一个。 我维护源代码并修复错误,并提供免费支持。

http://www.yart.com.au/Resources/Programming/ASP-NET-JQuery-Date-Time-Control.aspx