<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.0 Transitional//EN"
>
<HTML>
<HEAD>
<meta http-equiv=
"Content-Type"
content=
"text/html; charset=utf-8"
/>
<TITLE>日期控件datepicker</TITLE>
<!-- 引入 jQuery -->
<mce:script src=
"js/jquery.1.4.2.js"
mce_src=
"js/jquery.1.4.2.js"
type=
"text/javascript"
></mce:script>
<!--添加datepicker支持-->
<mce:script src=
"js/jquery.ui.core.js"
mce_src=
"js/jquery.ui.core.js"
type=
"text/javascript"
></mce:script>
<mce:script src=
"js/jquery.ui.datepicker.js"
mce_src=
"js/jquery.ui.datepicker.js"
type=
"text/javascript"
></mce:script>
<!-- 或者引入jquery ui包,其中也包含对datepicker的支持
<mce:script src=
"js/jquery-ui-1.7.3.custom.min.js"
mce_src=
"js/jquery-ui-1.7.3.custom.min.js"
type=
"text/javascript"
></mce:script>
-->
<!--引入样式css-->
<link type=
"text/css"
rel=
"stylesheet"
href=
"css/jquery-ui-1.7.3.custom.css"
mce_href=
"css/jquery-ui-1.7.3.custom.css"
/>
<!-- 添加中文支持-->
<mce:script src=
"js/jquery.ui.datepicker-zh-CN.js"
mce_src=
"js/jquery.ui.datepicker-zh-CN.js"
type=
"text/javascript"
></mce:script>
<mce:script type=
"text/javascript"
><!--
$(
function
(){
$(
"#selectDate"
).datepicker({
numberOfMonths:1,
showButtonPanel:true,
dateFormat:
'yy-mm-dd'
,
clearText:
"清除"
,
closeText:
"关闭"
,
yearSuffix:
'年'
,
showMonthAfterYear:true,
defaultDate:
'2011-03-10'
,
minDate:
'2011-03-05'
,
maxDate:
'2011-03-20'
,
onSelect:
function
(selectedDate) {
alert(selectedDate);
}
});
});
</HEAD>
<BODY>
<input type=
"text"
id=
"selectDate"
readonly=
"readonly"
/>
</BODY>
</HTML>