Jquery日历插件制作简单日历_jquery

$(“.selector”).datepicker(options);

其中”.selector”表示DOM元素，一般指文本框，由于该插件的作用是提供日期选择，因此常与一个文本框绑定，将选择后的日期显示在该文本框中，选择options是一个对象与前面插件中的options一样，通过改变其参数对应的值，从而实现插件功能的变化，在datepicker插件中，选择options常用参数如下

1、changeMonth 设置一个布尔值，如果wietrue，则可以在标题处出现一个下拉选择框，可以选择月份，默认值为false
2、changeYear 设置一个布尔值，如果为true，则可以在标题处出现一个下拉选择框，可以选择年份，默认为false
3、showButtonPanel 设置一个布尔值，如果为true，则在日期的下面显示一个面板，其中有两个按钮；一个为“今天”，另一个按钮为“关闭”，默认值为false，表示不显示
4、closeText 设置关闭按钮上的文字信息，这项设置的前提是，showButtonPanel的值必须为true，否则显示不了效果
5、dateFormat 设置显示在文本框（text）中的日期格式，可设置为{dateFormat,'yy-mm-dd'},表示日期的格式为年-月-日，如2012-10-1
6、defaultDate 设置一个默认日期值，如{defaultDate+7}，表示，弹出日期选择窗口后，默认的日期是在当前日期上加上7天
7、showAnim 设置显示弹出或隐藏日期选择窗口的方式。可以设置的方式有，“show”、“sildeDown”、“fadeln”后者“”，表示没有弹出日期选择窗口的方式
8、showWeek 设置一个布尔值，如果为true，则可以显示每天对应的星期，默认值为false
9、yearRange 设置年份的范围

最近在研究js插件的开发，以前看大神们，对插件都是信手拈来，随便玩弄，感觉自己要是达到那种水平就好了，就开始自己研究插件开发了。研究了一段时间之后，就开始写了自己的第一个日历插件，由于是初学插件开发，代码的可读性可能有点差，希望各位大神可以多提点意见，以后维护代码，让这个插件更加的完整。

下面就贴出代码。

首先，给插件来个整体的div容器

本人习惯给容器取class或id名时，加上自己独特的前缀，这样，有助于识别自己的代码，也避免与其他同事的样式冲突。

然后就是开始写样式，可以根据自己的需求来调整样式

第三步，就是插件的代码了

那么，插件就差不多完成了，现在只需要调用插件的方法就可以了

效果如图：