1、使用版本1.10.4
2、需要导入的js及css
<link rel="stylesheet" href="css/jquery.ui.all.css" type="text/css"> <link rel="stylesheet" href="css/jquery.ui.datepicker.css" type="text/css"> <script src="javascript/jquery.js"></script> <script src="javascript/jquery.ui.core.js"></script> <script src="javascript/jquery.ui.widget.js"></script> <script src="javascript/jquery.ui.datepicker.js"></script> <link rel="stylesheet" href="css/demos.css" type="text/css">
这里要特别注意ui.datepicker. css,如果不导入它,那么出现时间选择器的时候将会没有样式。而且其他的样式文件,如ui.core.css,等都要导入进来,他们之间相互有关联。智能说很蛋疼。想单导入这几个文件然后实现,将会没有样式或不全
3、以下是他的一些属性
this.regional[""] = { // Default regional settings closeText: "Done", // Display text for close link prevText: "Prev", // Display text for previous month link nextText: "Next", // Display text for next month link currentText: "Today", // Display text for current month link monthNames: ["January","February","March","April","May","June", "July","August","September","October","November","December"], // Names of months for drop-down and formatting monthNamesShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], // For formatting dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], // For formatting dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], // For formatting dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"], // Column headings for days starting at Sunday weekHeader: "Wk", // Column header for week of the year dateFormat: "mm/dd/yy", // See format options on parseDate firstDay: 0, // The first day of the week, Sun = 0, Mon = 1, ... isRTL: false, // True if right-to-left language, false if left-to-right showMonthAfterYear: false, // True if the year select precedes month, false for month then year yearSuffix: "" // Additional text to append to the year in the month headers };
以下是我的代码
$('#datepicker').datepicker({ dateFormat: 'yy-mm-dd', //日期格式,自己设置 yearRange: '1990:2008',//年份范围 monthNamesShort: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"], // For formatting changeMonth: true, changeYear: true });
这里monthNamesShort改为说明的monthNames好像用不了。