现在的位置: 首页 > 综合 > 正文

使用jquery做datepicker

2018年09月27日 ⁄ 综合 ⁄ 共 1935字 ⁄ 字号 评论关闭

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好像用不了。

抱歉!评论已关闭.