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

 更新时间:2019年09月06日 18:10:10   作者:may_walkaway  
今天小编就为大家分享一篇使用layui日期控件laydate对开始和结束时间进行联动控制的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

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的注意事项

    实现高性能javascript的注意事项

    JavaScript代码在web应用程序中经常用到,但是很多开发者忽视了一些性能方面的知识,如何编写高性能javascript代码呢?接下来,小编跟大家一起学习
    2019-05-05
  • JavaScript算法题之如何将一个数组旋转k步

    JavaScript算法题之如何将一个数组旋转k步

    这篇文章主要给大家介绍了关于JavaScript算法题之如何将一个数组旋转k步的相关资料,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2022-03-03
  • JavaScript库 开发规则

    JavaScript库 开发规则

    1. 保持无侵入性,标记不想知道你的JavaScript代码;2. 严禁修改和扩展Object.prototype!;3. 对JavaScript内建对象的扩展越少越好;4. 跟随标准;5. 或着跟随主导 ;6. 保持灵活;7. 管理内存;8. 淘汰浏览器嗅探;9. 小巧更佳……
    2009-01-01
  • 深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性

    深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性

    这篇文章主要介绍了JavaScript字符串操作方法 slice、substr、substring及其IE兼容性 的相关资料,需要的朋友可以参考下
    2015-12-12
  • 微信小程序云开发实现云数据库读写权限

    微信小程序云开发实现云数据库读写权限

    这篇文章主要为大家详细介绍了微信小程序云开发实现云数据库读写权限,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-05-05
  • BootStrapValidator校验方式

    BootStrapValidator校验方式

    做输入校验的时候如果你前端框架用的是bootstrap的话,首推bootstrapValidator校验方式,下面通过本文给大家分享下校验流程,一起看看吧
    2016-12-12
  • JS实现碰撞检测的方法分析

    JS实现碰撞检测的方法分析

    这篇文章主要介绍了JS实现碰撞检测的方法,结合实例形式分析了javascript碰撞检测的原理与相关操作技巧,需要的朋友可以参考下
    2018-01-01
  • layui加载表格,绑定新增,编辑删除,查看按钮事件的例子

    layui加载表格,绑定新增,编辑删除,查看按钮事件的例子

    今天小编就为大家分享一篇layui加载表格,绑定新增,编辑删除,查看按钮事件的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js实现可折叠展开的手风琴菜单效果

    js实现可折叠展开的手风琴菜单效果

    这篇文章主要介绍了js实现可折叠展开的手风琴菜单效果,通过简单的样式变换控制菜单项的展开与折叠功能,非常简单实用,需要的朋友可以参考下
    2015-09-09
  • 详解JS中的对象字面量

    详解JS中的对象字面量

    这篇文章主要介绍了JS中的对象字面量,对ES6感兴趣的同学,可以参考下
    2021-05-05

最新评论