jedate日期插件使用
2018-04-02 09:50
399 查看
jedate的官网地址jedate :http://www.jemui.com/uidoc/jedate.html
以下用的jQuery的.还有vue的方法: /*绑定节点*/
var startData = $("#startData"),
endData = $("#endData");
var start = {
format: 'YYYY-MM-DD',
isinitVal:false,
onClose:false,
isTime:false,
maxDate: $.nowDate({DD:0},'YYYY-MM-DD'), //最大日期
okfun: function(obj){
end.minDate = obj.val; //开始日选好后,重置结束日的最小日期
endDates();
}
};
var end = {
format: 'YYYY-MM-DD',
isinitVal:false,
onClose:false,
isTime:false,
// minDate: startData.val(), //设定最小日期为当前日期
maxDate: $.nowDate({DD:0},'YYYY-MM-DD'), //最大日期
okfun: function(obj){
start.maxDate = obj.val; //将结束日的初始值设定为开始日的最大日期
}
};
//这里是日期联动的关键
function endDates() {
//将结束日期的事件改成 false 即可
end.trigger = false;
endData.jeDate(end);
}
/*运行*/
startData.jeDate(start);
endData.jeDate(end);
这里是vue调用发放//VUE方法调用,
<div class="choosejedate row col-md-12 text-center" id="choosejedate">
<span >请选择年月</span>
<input id="vueymd" type="text" placeholder="YYYY年MM月DD日 hh:mm:ss" readonly>
</div>
<script>
var app = new Vue({
el: '#choosejedate',
methods:function() {
this.mounted()
},
mounted:function(){
$.jeDate("#vueymd",{
format: "YYYY-MM-DD hh:mm:ss",
festival:true,
})
}
})
</script>
<style scoped>
.choosejedate{margin:0;}
.choosejedate input{ height: 40px;}
</style>
具体参数配置,在文档中有详细说明!
以下用的jQuery的.还有vue的方法: /*绑定节点*/
var startData = $("#startData"),
endData = $("#endData");
var start = {
format: 'YYYY-MM-DD',
isinitVal:false,
onClose:false,
isTime:false,
maxDate: $.nowDate({DD:0},'YYYY-MM-DD'), //最大日期
okfun: function(obj){
end.minDate = obj.val; //开始日选好后,重置结束日的最小日期
endDates();
}
};
var end = {
format: 'YYYY-MM-DD',
isinitVal:false,
onClose:false,
isTime:false,
// minDate: startData.val(), //设定最小日期为当前日期
maxDate: $.nowDate({DD:0},'YYYY-MM-DD'), //最大日期
okfun: function(obj){
start.maxDate = obj.val; //将结束日的初始值设定为开始日的最大日期
}
};
//这里是日期联动的关键
function endDates() {
//将结束日期的事件改成 false 即可
end.trigger = false;
endData.jeDate(end);
}
/*运行*/
startData.jeDate(start);
endData.jeDate(end);
这里是vue调用发放//VUE方法调用,
<div class="choosejedate row col-md-12 text-center" id="choosejedate">
<span >请选择年月</span>
<input id="vueymd" type="text" placeholder="YYYY年MM月DD日 hh:mm:ss" readonly>
</div>
<script>
var app = new Vue({
el: '#choosejedate',
methods:function() {
this.mounted()
},
mounted:function(){
$.jeDate("#vueymd",{
format: "YYYY-MM-DD hh:mm:ss",
festival:true,
})
}
})
</script>
<style scoped>
.choosejedate{margin:0;}
.choosejedate input{ height: 40px;}
</style>
具体参数配置,在文档中有详细说明!
相关文章推荐
- jeasyui日期使用插件My97DatePicker/WdatePicker.js
- bootstrap日期插件datetimepicker的简单使用
- WdatePicker日期插件的使用(简洁实例)
- WdatePicker.js时间日期插件的使用方法
- jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明
- LCalendar 移动端轻量级日期选择插件使用
- my97前端日期插件使用示例
- 微信页面使用的日期插件
- 日期插件DataRangePicker的使用方法及相关设置
- JQuery日期插件datepicker的使用
- Jquery中日期插件jquery.datepick的使用
- 日期插件WdatePicker.js的使用方法
- bootstrap datetimepicker日期插件简单使用方法
- bootstrap日期插件的使用
- [置顶] JQuery日期插件datepicker的使用
- jQuery日期和时间插件(jquery-ui-timepicker-addon.js)中文破解版使用
- WdatePicker日期插件的简单使用
- js日历选择日期插件使用(My970DatePicker)
- bootstrap input-file上传插件和bootstrap datetimepicker日期插件使用Demo
- datetimepicker、mobiscroll日期插件使用demo