使用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 相关文章推荐
{}与function(){}选用空对象{}来存放keyValue
May 23 Javascript
js修改input的type属性及浏览器兼容问题探讨与解决
Jan 23 Javascript
JavaScript回调(callback)函数概念自我理解及示例
Jul 04 Javascript
jQuery.holdReady()使用方法
May 20 Javascript
jQuery中end()方法用法实例
Jan 08 Javascript
javascript仿百度输入框提示自动下拉补全
Jan 07 Javascript
vue项目打包上传github并制作预览链接(pages)
Apr 19 Javascript
Express结合Webpack的全栈自动刷新
May 23 Javascript
vue移动端使用appClound拉起支付宝支付的实现方法
Nov 21 Javascript
eslint+prettier统一代码风格的实现方法
Jul 22 Javascript
JS数组转字符串实现方法解析
Sep 04 Javascript
arcgis.js控制地图地体的显示范围超出区域自动弹回(实现思路)
Jan 28 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创建者模式
2014/11/25 PHP
php删除文本文件中重复行的方法
2015/04/28 PHP
php中smarty区域循环的方法
2015/06/11 PHP
php使用ZipArchive函数实现文件的压缩与解压缩
2015/10/27 PHP
php中Ioc(控制反转)和Di(依赖注入)
2017/05/07 PHP
PHP使用HTML5 FileApi实现Ajax上传文件功能示例
2019/07/01 PHP
php测试kafka项目示例
2020/02/06 PHP
8个超棒的学习 jQuery 的网站 推荐收藏
2011/04/02 Javascript
现代 JavaScript 开发编程风格Idiomatic.js指南中文版
2014/05/28 Javascript
JavaScript将字符串转换为整数的方法
2015/04/14 Javascript
iPhone手机上搭建nodejs服务器步骤方法
2015/07/06 NodeJs
JS验证邮件地址格式方法小结
2015/12/01 Javascript
jquery实现简单的全选和反选功能
2016/01/02 Javascript
轻松搞定jQuery.noConflict()
2016/02/15 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
2018/05/23 Javascript
angularjs 动态从后台获取下拉框的值方法
2018/08/13 Javascript
JavaScript常用工具方法封装
2019/02/12 Javascript
validform表单验证的实现方法
2019/03/08 Javascript
通过JS运行机制的角度说说作用域
2019/03/12 Javascript
JS实现商城秒杀倒计时功能(动态设置秒杀时间)
2019/12/12 Javascript
微信小程序入门之绘制时钟
2020/10/22 Javascript
nuxt.js 在middleware(中间件)中实现路由鉴权操作
2020/11/06 Javascript
基于Python的接口测试框架实例
2016/11/04 Python
python3.6数独问题的解决
2019/01/21 Python
python+selenium实现自动化百度搜索关键词
2019/06/03 Python
pytorch 批次遍历数据集打印数据的例子
2019/12/30 Python
使用python采集Excel表中某一格数据
2020/05/14 Python
运动鞋、足球鞋和慕尼黑球衣:Sport Münzinger
2019/08/26 全球购物
Timberland法国官网:购买靴子、鞋子、衣服、夹克和配饰
2019/11/30 全球购物
英国奢侈品牌时尚购物平台:Farfetch(支持中文)
2020/02/18 全球购物
如何拷贝一整个Java对象,包括它的状态
2013/12/27 面试题
公务员职业生涯规划书范文  
2014/01/19 职场文书
倡议书的写法
2014/08/30 职场文书
活动总结书怎么写
2015/05/11 职场文书
读《解忧杂货店》有感:请相信一切都是最好的安排
2019/11/07 职场文书
mysql 子查询的使用
2022/04/28 MySQL