DIY仿win7日历的JS日历控件

最新推荐文章于 2015-11-23 09:24:00 发布

程序员kenny

最新推荐文章于 2015-11-23 09:24:00 发布

阅读量3k

点赞数

分类专栏： Javascript/Jquery 文章标签：日历 calendar jquery function callback input

本文链接：https://blog.csdn.net/kenny0613/article/details/6457429

版权

Javascript/Jquery 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

现网上很多各种各样的JS日历控件，前断时间正好在项目开发过程中也用着选择日期，在网上搜索了好多都不是很合心意。于是在那时，突然心血来潮想自己尝试下写出一个有特式一点的供调用。所以今天将自己这个DIY的一个JS日历控件共享一下，该日历控件外形与WIN7的相似，经反复测过，支持目前所有流行的浏览器。

如果页面中存在两个文本框，如：

……

</body>

具体JS调用代码如下：$(function () { $("#txtBeginDate").calendar({ controlId: "divDate", // 弹出的日期控件ID，默认: $(this).attr("id") + "Calendar" speed: 200, // 三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000),默认：200 complement: true, // 是否显示日期或年空白处的前后月的补充,默认：true readonly: true, // 目标对象是否设为只读，默认：true upperLimit: new Date(), // 日期上限，默认：NaN(不限制) lowerLimit: new Date("2011/01/01"), // 日期下限，默认：NaN(不限制) callback: function () { // 点击选择日期后的回调函数 alert("您选择的日期是：" + $("#txtBeginDate").val()); } }); $("#txtEndDate").calendar(); });

运行效果图：