分類  >  Web前端 >

JQuery UI兌現先擇年份和月份,沒有日

tags:    時間:2013-12-11 11:13:01
JQuery UI實現先擇年份和月份,沒有日

首先,要有以下幾個文件

<link href="redmond/jquery.ui.all.css" type="text/css" rel="Stylesheet"/>

<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>

<script type="text/javascript" src="js/jquery.ui.core.js"></script>

<script type="text/javascript" src="js/jquery.ui.widget.js"></script>

<script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>

<script type="text/javascript" src="js/jquery.ui.datepicker-zh-CN.js"></script>

然後,就可以開始寫初始化代碼了,

 

<script type="text/javascript"> $(document).ready(function() { 	$("#datepicker").datepicker({ 		showMonthAfterYear: true, 		changeYear: true, 		changeMonth: true, 		showButtonPanel: false, 		dateFormat: 'yyyy-mm', 		nextText: '下個月', 		prevText: '上個月', 		hideIfNoPrevNext: false, 		regional: 'zh-CN', 		onClose: function(dateText, inst) {  			var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 			var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 			$(this).datepicker('setDate', new Date(year, month, 1)); 			$("#datepicker").val(year + '-' + (parseInt(month)+parseInt(1))); 		} 	}); 	$("#datepicker").datepicker($.datepicker.regional["zh-CN"] ); }) </script>
 

 

以下css用於屏蔽日的選擇界面,而只有年份和月份,

<style>
.ui-datepicker-calendar 
{
display: none;
}
</style>

推薦閱讀文章

Bookmark the permalink ,來源:互聯網