jquery time selection plugin - jedate
introduction
There are many date selection plugins, let's talk about jedate today
source code
Get started quickly
user target audience
<input class="datainp" id="indate" type="text" placeholder="请选择" readonly>
<input class="datainp" id="dateinfo" type="text" placeholder="请选择" readonly>
- 1
- 2
- 3
Instructions
<script type="text/javascript">
jeDate({
dateCell:"#indate",//isinitVal:true,
format:"YYYY-MM-DD",
isTime:false, //isClear:false,
minDate:"2014-09-19 00:00:00"
})
jeDate({
dateCell:"#dateinfo",
isinitVal:true,
isTime:true, //isClear:false,
minDate:"2014-09-19 00:00:00"
})
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
Core method: jeDate(options)
options是一个对象，它包含了以下key: '默认值'
dateCell:"#id", //目标元素。由于jedate.js封装了一个轻量级的选择器，因此dateCell还允许你传入class、tag这种方式 '#id .class'
format:"YYYY-MM-DD hh:mm:ss", //日期格式
minDate:"1900-01-01 00:00:00", //最小日期
maxDate:"2099-12-31 23:59:59", //最大日期
isinitVal:false, //是否初始化时间
isTime:false, //是否开启时间选择
isClear:true, //是否显示清空
festival:false, //是否显示节日
zIndex:999, //弹出层的层级高度
marks:null, //给日期做标注
choosefun:function(val) {}, //选中日期后的回调
clearfun:function(val) {}, //清除日期后的回调
okfun:function(val) {} //点击确定后的回调
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
【Custom Date Format】
<div id="test1" class="jedate-icon"></div>
<script>
jeDate({
dateCell: '#test1',
format: 'YYYY/MM', // 分隔符可以任意定义，该例子表示只显示年月
festival: true, //显示节日
choose: function(datas){ //选择日期完毕的回调
alert('得到：'+datas);
}
});
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
[The date range is limited to yesterday to tomorrow]
<div id="hello3" class="jedate-icon"></div>
<script>
jeDate({
dateCell: '#hello3',
minDate: jeDate.now(-1), //0代表今天，-1代表昨天，-2代表前天，以此类推
maxDate: jeDate.now(1) //1代表明天，2代表后天，以此类推
});
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
【Icon or other button trigger date】
<input class="datainp" id="datebut" type="text" placeholder="请选择" readonly>
<input type="button" onClick="jeDate({dateCell:'#datebut',isTime:true,format:'YYYY-MM-DD hh:mm:ss'})" value="打开">