<!--
laydate 日期时间控件
下载地址 http://www.layui.com/laydate/
这里用到版本为 layDate-v5.0.2
下载后将 laydate 文件夹放到项目根目录
对于输入框，如果用户乱填 laydate会智能纠错。（可以尝试在上述表单输入任意值，然后点击页面其它处测试一下）
注意事项
1，解压后，将压缩包内laydate整个文件夹放至项目的任意目录，不要移动其文件结构，它们具有完整的依赖体系。
2，使用只需在页面引入laydate.js即可。
3，如果网站的js采用合并或模块加载，需要打开laydate.js，修改path。
thinkPHP调用需要把 laydate 文件夹放到根目录，然后在模板页中按如下方式调用
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layDate 独立版</title>
</head>
<body>
<input type="text" id="test_txt" placeholder="yyyy-MM-dd"/>
<input type="button" id="test_but" value="点我也弹日期面板"/>
<div id="test_div">测试DIV</div>
<script type="text/javascript" src="laydate/laydate.js"></script>
<script type="text/javascript">
//执行一个laydate实例
var test_var = laydate.render({
elem: '#test_txt' //指定元素
//使用时选择一种type类型即可
//年选择器
,type: 'year'
//年月选择器
,type: 'month'
//时间选择器
,type: 'time'
//日期时间选择器
,type: 'datetime'
//日期选择器
,type: 'date'
//国际版 变成英文
//,lang: 'en'
//自定义格式
//,format: 'yyyy年M月d日H时m分s秒'
//限定可选日期
//可选最小日期
,min: '2017-08-05'
//可选最大日期
,max: '2017-09-13'
//前后若干天可选，这里以7天为例
,min: -7
,max: 7
//限定可选时间
,min: '2017-08-05 09:30:00'
,max: '2017-09-13 17:30:00'
//限定面板下方显示的按钮，这里是 清空，现在，确定三个按钮
//,btns: ['clear', 'now', 'confirm']
//打开日期面板默认选中值
,value: '2017-08-29'
//面板打开后执行其中动作
,ready: function(){
//提示内容
test_var.hint('日期可选值设定在 <br> 2017-08-05 到 2017-09-13');
}
//选中日期确定后的回调
,done: function(value, date){
alert('done你选择的日期是：' + value + '\n获得的对象是' + JSON.stringify(date));
}
//面板点击日期切换（并未确定）时回调
,change: function(value, date){
alert('change你选择的日期是：' + value + '\n\n获得的对象是' + JSON.stringify(date));
}
//不出现底部栏
//,showBottom: false
//自定触发义事件，这里指定当鼠标指针移动到元素上方，并按下鼠标按键时
,trigger: 'mousedown'
//,trigger: 'click'
//额外设定可触发元素，同点击本身元素同触发条件
,eventElem: '#test_but'
});
//非input元素
laydate.render({
elem: '#test_div'
});
</script>
</body>
</html>
