Jquery. datepicker calendar plugin

This datepicker should not be the datepicker plug-in jquery UI, although the name is case-insensitive.

The datepicker in jquery UI is not very easy to use in the whole UI. I am a lazy person, and I am not good at code stripping. To be honest, I also don't like the way in which he compresses and hides the display, I am tired of these effects, and practical applications are the first thing I need. So I search for and find this plug-in on the Internet.

Plug-in Source: http://www.kelvinluck.com/assets/jquery/datePicker/

The datepicker provided by the original website actually contains two JS files: datepicker. JS and date. JS. I think the call is affected, simply combine the two into one (if you are from the original website, note that it is different from the one in my example ).

Then, change the English name in the calendar to Chinese (at the top of the function, the original script is in date. set in JS), and then set date. change firstdayofweek = 1 to 0, change the first day of the week to Monday, change it to Sunday, and then slightly modify other details (I believe some script basics will be changed ).

At last, it was compressed. Due to the many source code annotations and one pressure, the original two files added up to more than 50 K, with only around 18 K left. Haha. There is also a bgiframe script, because the calendar plug-in has many applications on the form, it is very likely that there is a drop-down menu, needless to say, IE6's drop-down menu level no one can rival the problem is well known. Therefore, a jquery. bgiframe. Min. js source code is provided here:

 

<! -- [If IE]> <SCRIPT type = "text/JavaScript" src = "JS/jquery. bgiframe. Min. js"> </SCRIPT> <! [Endif] -->

 

If there is a drop-down menu under the calendar control, it will be OK to call another row.

Upload style, called by datepicker in a specific example:

HTML:

<Input type = "text" name = "it" class = "date-pick it"/>

JS:

$ (Window). Ready (function () {$ ('. Date-pick'). datepicker ({clickinput: true });});

 

I wrote:

JS:

$ (Document). Ready (init );

 

$ ('# Strjcsj'). datepicker ({

Date: $ ('# strjcsj'). Val (),

Current: $ ('# strjcsj'). Val (),

Position: 'bottom ',

Onbeforeshow: function (){

If ($ ('# strjcsj'). Val () = "" | $ (' # strjcsj'). Val () = NULL ){

Beforedate = strnowdate;

} Else {

Beforedate = $ ('# strjcsj'). Val ();

}

$ ('# Strjcsj'). datepickersetdate (beforedate, true );

},

Onchange: function (formated, dates ){

$ ('# Strjcsj'). Val (formated );

If (beforedate! = $ ('# Strjcsj'). Val ()){

Beforedate = $ ('# strjcsj'). Val ();

$ ('# Strjcsj'). datepickerhide ();

}

$ ("# Strjcsj"). Valid ();

}

});

 

JSP:

<S: textfield id = "strjcsj" name = "strjcsj" readonly = "true" theme = "simple" customfunction = "checkjcsj"/>

 

Clickinput is the selection parameter, indicating whether to display the calendar control, other more parameters, and more calling methods (double calendar, blog calendar mode, and date Selection Range) When you click the input box) you can see the original instructions on the site, address: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/

 

Note: There is a small bug: When the date in a single commit is invalid, an error will be reported on the page. Of course, this is the date that people will manually enter when they intentionally test the script, generally, viewers mainly choose dates in a convenient and intuitive manner. We look forward to perfection. (Set to readonly ?)

Click to download this file: http://www.cssrain.cn/attachments/month_0906/k2009629144950.rar

66 recommendation ---

My97 calendar controls: my97 home: http://www.my97.net/dp/index.aspmy97

Skin: http://www.cssrain.cn/article.asp? Id = 1343

 

From: http://www.cnblogs.com/skyaspnet/archive/2010/07/21/1669675.html

! [Endif] -->! -- [If>