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>
测试结果:
感谢您的阅读,欢迎参观我的个人网站:小嗨词典【 https://www.happydict.cn】