最近项目中使用了laydate插件,需要限制开始时间和结束时间的输入

1.type=date

要求:周期开始时间和周期结束时间以天为单位,结束时间不能早于开始时间,可以是同一天。

周期开始时间:<input class="layui-input" type="text" id="CycleStartTime">
周期结束时间:<input class="layui-input" type="text" id="CycleEndTime">
 
var cycleStart = laydate.render({
  elem: '#CycleStartTime'
  ,type: 'date'
  ,btns: ['confirm']
  ,done: function(value, date){
    cycleEnd.config.min = getDateArray(date);
  }
});
var cycleEnd = laydate.render({
  elem: '#CycleEndTime'
  ,type: 'date'
  ,btns: ['confirm']
  ,done: function(value, date){
    cycleStart.config.max = getDateArray(date);
  }
});
function getDateArray(date){
  var formatDate = {};
  formatDate.year = date.year;
  formatDate.month = date.month - 1;
  formatDate.date = date.date;
  return formatDate;
}
 

2.type=datetime

要求:开始时间早于结束时间,且不能相同

开始时间:<input class="layui-input" type="text" id="StartTime">
结束时间:<input class="layui-input" type="text" id="EndTime">
 
var editStart = laydate.render({
  elem: '#StartTime'
  ,type: 'datetime'
  ,btns: ['confirm']
  ,done: function(value, date) {
    editEnd.config.min = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds + 1
    };
    if (date.seconds == 59) {
      editEnd.config.min.minutes = date.minutes + 1;
      editEnd.config.min.seconds = 0;
    }
    if (date.seconds == 59 && date.minutes == 59) {
      editEnd.config.min.hours = date.hours + 1;
      editEnd.config.min.minutes = 0;
      editEnd.config.min.seconds = 0;
    }
    if (date.seconds == 59 && date.minutes == 59 && date.hours == 23) {
      editEnd.config.min.date = date.date + 1;
      editEnd.config.min.hours = 0;
      editEnd.config.min.minutes = 0;
      editEnd.config.min.seconds = 0;
    }
  }
});
var editEnd = laydate.render({
  elem: '#EndTime'
  ,type: 'datetime'
  ,btns: ['confirm']
  ,done: function(value, date) {
    editStart.config.max = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds - 1
    }
    if (date.seconds == 0) {
      editStart.config.max.minutes = date.minutes - 1;
      editStart.config.max.seconds = 59;
    }
    if (date.seconds == 0 && date.minutes == 0) {
      editStart.config.max.hours = date.hours - 1;
      editStart.config.max.minutes = 59;
      editStart.config.max.seconds = 59;
    }
    if (date.seconds == 0 && date.minutes == 0 && date.hours == 0) {
      editStart.config.max.date = date.date - 1;
      editStart.config.max.hours = 23;
      editStart.config.max.minutes = 59;
      editStart.config.max.seconds = 59;
    }
  }
});
 
说明:输入限制的情况下,必须去掉【清空】、【现在】按钮。
 

3.type=time

要求:开始时间早于结束时间,且不能相同

开始时间:<input class="layui-input" type="text" id="StartTime_add">
结束时间:<input class="layui-input" type="text" id="EndTime_add">
var addStart = laydate.render({
  elem: '#StartTime_add'
  ,type: 'time'
  ,btns: ['confirm']
  ,done: function(value, date) {
    addEnd.config.min = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds + 1
    };
    if (date.seconds == 59) {
      addEnd.config.min.minutes = date.minutes + 1;
      addEnd.config.min.seconds = 0;
    }
    if (date.seconds == 59 && date.minutes == 59) {
      addEnd.config.min.hours = date.hours + 1;
      addEnd.config.min.minutes = 0;
      addEnd.config.min.seconds = 0;
    }
    if (date.seconds == 59 && date.minutes == 59 && date.hours == 23) {
      $('.laydate-footer-btns').css({
        'cursor': 'not-allowed',
        'color': '#d2d2d2'
      });
      alert('开始时间不允许选择23:59:59');
    }
  }
});
var addEnd = laydate.render({
  elem: '#EndTime_add'
  ,type: 'time'
  ,btns: ['confirm']
  ,done: function(value, date) {
    addStart.config.max = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds - 1
    }
    if (date.seconds == 0) {
      addStart.config.max.minutes = date.minutes - 1;
      addStart.config.max.seconds = 59;
    }
    if (date.seconds == 0 && date.minutes == 0) {
      addStart.config.max.hours = date.hours - 1;
      addStart.config.max.minutes = 59;
      addStart.config.max.seconds = 59;
    }
    if (date.seconds == 0 && date.minutes == 0 && date.hours == 0) {
      $('.laydate-footer-btns').css({
        'cursor': 'not-allowed',
        'color': '#d2d2d2'
      });
      alert('结束时间不允许选择00:00:00');
    }
  }
});
说明:开始时间不允许选择23:59:59,结束时间不允许选择00:00:00。

laydate type=time/datetime/date 开始时间和结束时间的输入限制的更多相关文章

  1. My97DatePicker:开始时间和结束时间的最大间隔为1个月30天,并且不大于当前时间(3种方法)

    问题的背景 在之前做Web项目的时候,开始时间和结束时间,只有2个要求: 1.开始时间必须小于等于结束时间,不能超过当前时间. 2.结束时间必须大于等于开始时间,不能超过当前时间. 由于开始时间不大于 ...

  2. myDate97 设置开始时间和结束时间

      myDate97 设置开始时间和结束时间 CreationTime--2018年8月28日16点46分 Author:Marydon 1.简单示例 第一步:引入My97DatePicker/Wda ...

  3. datepicker约束开始时间和结束时间

    datepicker约束开始时间和结束时间作用就是:选择要搜索的日期范围. <!DOCTYPE html> <html lang="en"> <hea ...

  4. elementui的时间选择器开始时间和结束时间的限制

    开始时间不能大于结束时间 html代码部分 方法部分 开始时间和结束时间可以选同一天 <template> <div class="range-wrapper"& ...

  5. 更改hadoop集群yarn的webui中的开始时间和结束时间为本地时间

    yarn集群的webui地址为:http://rm:8088 执行任务后,任务的开始时间和结束时间都是utc时间,查看很不方便. 查找相关资料发现hadoop有补丁包,补丁地址:https://iss ...

  6. c# 获取 本周、本月、本季度、本年 的开始时间或结束时间

    #region 获取 本周.本月.本季度.本年 的开始时间或结束时间 /// <summary> /// 获取结束时间 /// </summary> /// <param ...

  7. My97DatePicker 日期控制,开始时间不能>结束时间,结束时间不能<开始时间

    <li>日期: <input type="text" style="margin-top: 5px;" value="${begin ...

  8. java获取本月开始时间和结束时间、上个月第一天和最后一天的时间以及当前日期往前推一周、一个月

    import java.text.SimpleDateFormat; import java.util.Calendar; import java.util.Date; import java.uti ...

  9. easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大

    easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大 >>>>>>>>>>> ...

随机推荐

  1. 部署 LAMP (CentOS 7.2)

    摘自:https://help.aliyun.com/document_detail/50774.html 简介 LAMP指Linux+Apache+Mysql/MariaDB+Perl/PHP/Py ...

  2. 【JZOJ4763】【NOIP2016提高A组模拟9.7】旷野大计算

    题目描述 输入 输出 样例输入 5 5 9 8 7 8 9 1 2 3 4 4 4 1 4 2 4 样例输出 9 8 8 16 16 数据范围 解法 离线莫队做法 考虑使用莫队,但由于在删数的时候难以 ...

  3. No.2 Verilog 模块和描述风格

    2-1 模块 Verilog语言基本的描述单元----模块,模块是用来描述某个设计的功能或结构,以及它与其它外部模块进行通信的端口. module module_name(port_list); De ...

  4. Java安全——密钥那些事

    标签(空格分隔): Java 安全 概念 密钥是加密算法不可缺少的部分.密钥在安全体系中至关重要,正如其名,私密的钥匙,打开安全的大门.密钥分两种:对称密钥和非对称密钥.非对称密钥里又包含公开密钥和私 ...

  5. swiper踩过的哪些坑

    最近,苦恼于各种轮播的需求,每个自己都要自己写,写的挺烦的.终于,在网上发现了swiper插件,发现还是挺实用的,但其中还是踩过了不少的坑,其中有不少都是很简单的问题,但到发现的时候都是花了不少时间, ...

  6. 集合--Set&&HashSet和TreeSet

    特点:元素无序,不可重复 1.添加元素 set.add("tanlei"); set.addAll(Arrays.asList(44,"磊","磊&q ...

  7. uva 10453 【回文串区间dp】

    Uva 10453 题意:给定字符串,问最少插入多少个字符使其变成回文串,并任意输出一种结果. 题解:和Uva 10739类似,这里是只能增加.类似定义dp[i][j]表示子串Si...Sj变为回文串 ...

  8. nodeJs学习-12 consolidate适配各种模板引擎

    const express=require('express'); const static=require('express-static'); const cookieParser=require ...

  9. 【转载】使用 gnuplot 在网页中显示数据

    来源:http://www.ibm.com/developerworks/cn/aix/library/au-gnuplot/ 简介 gnuplot 是一个用于生成趋势图和其他图形的工具.它通常用于收 ...

  10. LeetCode115 Distinct Subsequences

    Given a string S and a string T, count the number of distinct subsequences of T in S. (Hard) A subse ...