<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<script src="../../../../Scripts/jquery-1.10.2.js"></script>
<link href="../jquery-ui.css" rel="stylesheet" />
<script src="../jquery-ui.js"></script>
</head>
<body>
参考地址:http://www.runoob.com/jqueryui/example-datepicker.html
<br />
<br />
DIV 中 直接显示 :
<br />
<br />
<div id="datepicker" style="margin-right:10px; display:block; border-collapse:separate; font-family:'Microsoft YaHei'; font-size:14px; "></div>
<br />
<br />
文本框显示:
<br />
<br />
<div style="font-family:'Microsoft YaHei'; font-size:14px;margin-right:10px; display:block; border-collapse:separate; ">
<input type="text" id="txtDatepicker" style="height:25px; height:25px; line-height:25px;" />
</div>
<br />
<br />
<br />
<br />
<input type="button" value="取值" style="height:150px;width:150px; font-size:30px; " id="btnGetValue" />
<br />
<script language="javascript" type="text/javascript">
$("#btnGetValue").click(function () {
alert($("#datepicker").val());
alert($("#txtDatepicker").val());
});
$(function () {
$("#datepicker,#txtDatepicker").datepicker({
inline: true,
dateFormat: $.datepicker.W3C,
monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
onSelect: function () {
// LoadTimeInterval();
}
});
});
</script>
</body>
</html>
jQuery UI使用总结
最新推荐文章于 2023-03-28 08:35:27 发布