my97前端日期插件使用示例
首先,將my97日期插件的My97DatePicker文件夾整個放到項目的js文件夾下:
編寫前端代碼,日期輸入框的代碼如下:
<!-- 這裏可以用dateFmt寫日期格式,比如說yyyy-MM-dd格式 -->
<input type="text" class="Wdate" name="datetime" id="" value="" onfocus="WdatePicker({lang:'zh-cn',readOnly:true,dateFmt:'yyyy-MM-dd HH:mm:ss'})"/>
My97日期插件實例.html的代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js" ></script>
<script type="text/javascript">
$(function(){
// 日期驗證
$(":submit").click(function(){
if($("input[name=datetime]").val() == ""){
alert("日期爲空!");
return false;
}else{
alert($("input[name=datetime]").val());
}
});
});
</script>
</head>
<body>
<form action="" method="post">
<table border="0" cellspacing="0">
<tr>
<td>出生日期:</td>
<td><input type="text" class="Wdate" name="datetime" id="" value="" onfocus="WdatePicker({lang:'zh-cn',readOnly:true,dateFmt:'yyyy-MM-dd HH:mm:ss'})"/></td>
</tr>
<tr>
<td出生日期:</td>
<td><input type="submit" value="提交"/></td>
</tr>
</table>
</form>
</body>
</html>
測試結果: