jquery日期时间选择器

Question

任何机构都可以告诉我们如何使用Jquery日历日期时间选择器。

Answer 1

请参阅：

http://jqueryui.com/demos/datepicker/

还有这些演示的文档。

Answer 2

您执行以下操作：

1. 下载需要UI核心的jQuery UI datepicker。
2. 将脚本引用添加到您的页面，将CSS添加到主题
3. 添加代码以将日期选择器绑定到文本框，如下所示：

您可以在此处阅读文档：http://jqueryui.com/demos/datepicker/

<input id="datepicker" type="text">
<script type="text/javascript">
    $(function() {
        $("#datepicker").datepicker();
    });
</script>

Answer 3

对于默认选项，它只是

$(function() {  // function to execute when DOM is ready
    $('#input').datepicker(); // run datepicker on jQuery object
});

你有

的地方

<input type="text" id="input" />

在您的标记中。您需要按以下顺序引用脚本

1. jQuery脚本
2. datepicker脚本
3. 您的脚本在DOM就绪上绑定了datepicker。

更高级的示例 check out this demo 。如果您想查看其背后的代码，请将 / edit 添加到网址。

Answer 4

您也可以考虑使用原生HTML5 datepicker。用户Modernizr决定是否使用浏览器本机。

Answer 5

如果HTML5 datepicker不可用，那么使用HTML5并回退到jQuery UI呢？

<script type="text/javascript">
$(document).ready(function () {
    if (!Modernizr.inputtypes.date){
        // if no native support, use a datepicker script
        $(':input[type=datetime]').datepicker();
    }
});
</script>

Answer 6

试试这个

$( "#dateTime" ).datetimepicker({ 
    dateFormat: 'yy-mm-dd', 
    changeMonth: true,
    changeYear: true,

});