Usage of jquery UI Datepicker time control (1)

This article mainly introduces how to use the jquery ui datepicker time control. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

Learn about the jquery ui datepicker time control through examples. Let me first take a look at the rendering:

Effect:

Common occasions:

1.Input box

2.div

Instructions for use:

1. Restricted date

$("#resultDiv").datepicker({
 onSelect: function (dateText, inst) {
 //代码：选择日期后触发的事件
 },
 minDate: new Date(),//最小日期
 maxDate: new Date($("#DateLimit").val())//最大日期
 });

2.Chinese

jQuery(function ($) {
 $.datepicker.regional['zh-CN'] = {
 closeText: '关闭',
 prevText: &#39;<上月&#39;,
 nextText: &#39;下月>&#39;,
 currentText: &#39;今天&#39;,
 monthNames: [&#39;一月&#39;, &#39;二月&#39;, &#39;三月&#39;, &#39;四月&#39;, &#39;五月&#39;, &#39;六月&#39;,
 &#39;七月&#39;, &#39;八月&#39;, &#39;九月&#39;, &#39;十月&#39;, &#39;十一月&#39;, &#39;十二月&#39;],
 monthNamesShort: [&#39;一&#39;, &#39;二&#39;, &#39;三&#39;, &#39;四&#39;, &#39;五&#39;, &#39;六&#39;,
 &#39;七&#39;, &#39;八&#39;, &#39;九&#39;, &#39;十&#39;, &#39;十一&#39;, &#39;十二&#39;],
 dayNames: [&#39;星期日&#39;, &#39;星期一&#39;, &#39;星期二&#39;, &#39;星期三&#39;, &#39;星期四&#39;, &#39;星期五&#39;, &#39;星期六&#39;],
 dayNamesShort: [&#39;周日&#39;, &#39;周一&#39;, &#39;周二&#39;, &#39;周三&#39;, &#39;周四&#39;, &#39;周五&#39;, &#39;周六&#39;],
 dayNamesMin: [&#39;日&#39;, &#39;一&#39;, &#39;二&#39;, &#39;三&#39;, &#39;四&#39;, &#39;五&#39;, &#39;六&#39;],
 weekHeader: &#39;周&#39;,
 dateFormat: &#39;yy-mm-dd&#39;,
 firstDay: 1,
 isRTL: false,
 showMonthAfterYear: true,
 yearSuffix: &#39;年&#39;
 };
 $.datepicker.setDefaults($.datepicker.regional[&#39;zh-CN&#39;]);
 });

The above is how to use the jquery ui datepicker time control. The content is very simple. The purpose is to let you know about the UI datepicker time control. I hope you will like it. The jquery ui datepicker time control is not over yet. Next This article will continue to provide in-depth understanding.

Related recommendations

Usage of jquery UI Datepicker time control (2)

Usage of jquery UI Datepicker time control (3)

Recommended related video tutorials: jQuery Tutorial (Video)

The above is the detailed content of Usage of jquery UI Datepicker time control (1). For more information, please follow other related articles on the PHP Chinese website!