基于jquery-UI的日期选择器

时间 2021-08-15

先上效果图：

简单的点击文本框弹出日期

代码

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI 日期选择器（Datepicker） - 显示月份 &amp; 年份菜单</title>
    <link rel="stylesheet" href="jquery-ui.min.css">
    <script src="jquery.js"></script>
    <script src="jquery-ui.min.js"></script>
    <script>
        $(function() {
            $( "#datepicker" ).datepicker({
                changeMonth: true,
                changeYear: true,
                dateFormat:"yy-mm-dd"
            });
        });
    </script>
</head>
<body>
<p>日期：<input type="text" id="datepicker"/></p>
</body>
</html>

调整日期格式什么的官网上都有例子

地址：http://www.runoob.com/jqueryui/example-datepicker.html

最后附上引用的文件，打包了可以在里面选择：http://files.cnblogs.com/files/ysj4428/jquery-ui-1.12.1.custom.zip

遇到的问题：

文件引用中应该注意引用js文件顺序，jquery应该在做上面，而且在一些引用其他插件的页面中可能有冲突，调整引用位置即可