使用layui日期控件laydate对开始和结束时间进行联动控制的方法


Posted in Javascript onSeptember 06, 2019

1.在页面先引入laydate.js文件

2.html页面控件如下:

<input name="begin_time" style="margin-top:8px;width:130px;" id="begin_time" value="${beginTime}" class="Wdate" type="text"/>
<input name="deadline_time" style="margin-top:8px;width:130px;" id="deadline_time" value="${deadlineTime}" class="Wdate" type="text"/>

3.html页面js代码如下:

//年月选择器
laydate.render({
 elem: '#begin_time'
 ,type: 'month'
 ,min: '${minBeginTime}-29'
 ,max: '${maxBeginTime}-29'
 ,done: function(value){
  $("#deadline_time").remove();
  $("#myd").append('<input name="deadline_time" style="margin-top:8px;width:130px;" id="deadline_time" class="Wdate" type="text"/>');
  $("#deadline_time").val(value);
  $.ajax({
    url:'reportYearMonth/getMaxMinEndTime.json',
    data:{minTime:value},
    type:'post',
    dataType:'json',
    success:function(data){
      laydate.render({
       elem: '#deadline_time'
       ,type: 'month'
       ,min:data.minEndTime+'-29'
       ,max:data.maxEndTime+'-29'
      });
    }
  });
 }
});

以上这篇使用layui日期控件laydate对开始和结束时间进行联动控制的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
完整显示当前日期和时间的JS代码
Sep 17 Javascript
JavaScript 错误处理与调试经验总结
Aug 10 Javascript
ASP.NET jQuery 实例2 (表单中使用回车在TextBox之间向下移动)
Jan 13 Javascript
js返回上一页并刷新的多种实现方法
Feb 26 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 Javascript
jQuery实现标题有打字效果的焦点图代码
Nov 16 Javascript
AngualrJS中每次$http请求时的一个遮罩层Directive
Jan 26 Javascript
详解webpack分离css单独打包
Jun 21 Javascript
label+input实现按钮开关切换效果的实例
Aug 16 Javascript
利用JS制作万年历的方法
Aug 16 Javascript
CKEditor4配置与开发详细中文说明文档
Oct 08 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 Javascript
解决layer.open后laydate失效的问题
Sep 06 #Javascript
layui的表单验证支持ajax判断用户名是否重复的实例
Sep 06 #Javascript
layui在form表单页面通过Validform加入简单验证的方法
Sep 06 #Javascript
layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子
Sep 06 #Javascript
layer的prompt弹出框,点击回车,触发确定事件的方法
Sep 06 #Javascript
vue按需加载实例详解
Sep 06 #Javascript
详解Nuxt.js中使用Element-UI填坑
Sep 06 #Javascript
You might like
php学习笔记 [预定义数组(超全局数组)]
2011/06/09 PHP
54个提高PHP程序运行效率的方法
2015/07/19 PHP
php+ajax无刷新分页实例详解
2015/12/07 PHP
PHP弱类型的安全问题详细总结
2016/09/25 PHP
php中static 静态变量和普通变量的区别
2016/12/01 PHP
Thinkphp实现站点静态化的方法详解
2017/03/21 PHP
浅谈PHP无限极分类原理
2019/03/14 PHP
gearman中worker常驻后台,导致MySQL server has gone away的解决方法
2020/02/27 PHP
javascript 全选与全取消功能的实现代码
2012/12/23 Javascript
JS前端框架关于重构的失败经验分享
2013/03/17 Javascript
js中window.open()的所有参数详细解析
2014/01/09 Javascript
JS数组去重与取重的示例代码
2014/01/24 Javascript
jquery通过ajax加载一段文本内容的方法
2015/01/15 Javascript
Node.js的MongoDB驱动Mongoose基本使用教程
2016/03/01 Javascript
微信小程序实现带刻度尺滑块功能
2017/03/29 Javascript
Angular 4依赖注入学习教程之ClassProvider的使用(三)
2017/06/04 Javascript
用element的upload组件实现多图片上传和压缩的示例代码
2019/02/12 Javascript
Vue组件内部实现一个双向数据绑定的实例代码
2019/04/04 Javascript
Vue 利用指令实现禁止反复发送请求的两种方法
2019/09/15 Javascript
javascript实现简易的计算器
2020/01/17 Javascript
javascript浅层克隆、深度克隆对比及实例解析
2020/02/09 Javascript
vue组件库的在线主题编辑器的实现思路
2020/04/03 Javascript
Python获取网页上图片下载地址的方法
2015/03/11 Python
Python面向对象编程中关于类和方法的学习笔记
2016/06/30 Python
Python 逐行分割大txt文件的方法
2017/10/10 Python
Python实现Kmeans聚类算法
2020/06/10 Python
详解Python数据分析--Pandas知识点
2019/03/23 Python
Python调用C语言的实现
2019/07/26 Python
Python pandas库中的isnull()详解
2019/12/26 Python
Python开发之基于模板匹配的信用卡数字识别功能
2020/01/13 Python
css3动画效果抖动解决方法
2018/09/03 HTML / CSS
中粮集团旗下食品网上购物网站:我买网
2016/09/22 全球购物
设置器与访问器的定义以及各自特点
2016/01/08 面试题
英语专业推荐信
2013/11/16 职场文书
企业内部培训方案
2014/02/04 职场文书
苹果发布了MagSafe固件更新,可以不外接电源实现最高7.5W充电
2022/04/21 数码科技