layui 时间选择器laydate开始时间结束时间限制,及设置默认时分秒

2023-11-13

这个时间控件实现了:

  1. 开始时间和结束时间都不得超过当前时间
  2. 结束时间大于开始时间并且小于当前时间
  3. 开始时间默认时分秒为00 00 00
  4. 结束时间默认时分秒为23 59 59
  5. 其他官方自带功能

项目中的需求是, 结束时间要大于开始时间,包括时分秒,开始时间选择的时间范围最大不能超过今天的时间,结束时间的选择依据开始时间的选择,如下代码
在这里插入图片描述
layui时间控件封装成一个简单的方法

		//此项目时间控件的方法(结束时间大于开始时间,)
		//startName 开始时间标签ID
		//endName	结束时间标签ID
    setTimeControl: function (startName, endName) {
        //日期范围
        layui.use(['layer','laydate'], function () {
            var layer = layui.layer,
                laydate = layui.laydate;
            var startDate = laydate.render({
                elem: startName,
                type: 'datetime',
                max: utils.getNowFormatDate(), //设置一个默认最大值
                ready: function(date){//设置默认值,选择日期不选择时分秒时的默认值
                    this.dateTime.hours=00;
                    this.dateTime.minutes=00;
                    this.dateTime.seconds=00;
                },
                done: function (value, date) {
                    var currentDate = new Date();
                    endDate.config.min = {
                        year: date.year,
                        month: date.month - 1, //关键
                        date: date.date,
                        hours: date.hours,
                        minutes: date.minutes,
                        seconds: date.seconds,
                    };
                }
            })
            var endDate = laydate.render({
                elem: endName, //选择器结束时间
                type: 'datetime',
                max: utils.getNowFormatDate(), //设置一个默认最大值
                ready: function(date){
                    this.dateTime.hours=23;
                    this.dateTime.minutes=59;
                    this.dateTime.seconds=59;
                },
                done: function (value, date) {
                    var currentDate = new Date();
                    startDate.config.max = {
                    // 此处的三目运算详见下面的附言
                        year: date.year?date.year:currentDate.getFullYear(),
                        month: date.month?date.month - 1:currentDate.getMonth(), 
                        date: date.date?date.date:currentDate.getDate(),
                        hours: date.hours?date.hours:currentDate.getHours(),
                        minutes: date.minutes?date.minutes:currentDate.getMinutes(),
                        seconds: date.seconds?date.seconds:currentDate.getSeconds(),
                    }
                    $(endName + " ol li:last-child").click()
                }
            });
        });

    },

附言:网上有很多朋友的写法没有这个三目运算符, 但是在我的实际项目运用中,发现了一个bug,直接上图
在这里插入图片描述
无论开始时间选择或没选择的情况下,有值或无值,我在结束时间里,直接点击了清空,那么,开始时间里面的日期选项会全部是禁用的状态,如果用户正常操作一次性选择日期时间正确的情况下,是没问题的,但是测试同事既然测出来了,作为开发也得改啊,所以就优化了一下

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

layui 时间选择器laydate开始时间结束时间限制,及设置默认时分秒 的相关文章

  • 网络安全——数据链路层安全协议

    作者简介 一名云计算网络运维人员 每天分享网络与运维的技术与干货 座右铭 低头赶路 敬事如仪 个人主页 网络豆的主页 目录 前言 一 数据链路层安全协议简介 1 数据链路安全性 二 局域网数据链路层协议 1 本地链路局域网 LAN 2 广域
  • 学习笔记:简谈推挽电路

    推挽电路 push pull 就是两个不同极性晶体管间连接的输出电路 推挽电路采用两个参数相同的功率BJT管或MOSFET管 以推挽方式存在于电路中 各负责正负半周的波形放大任务 电路工作时 两只对称的功率开关管每次只有一个导通 所以导通损
  • 数据库数据恢复-Oracle数据库数据恢复案例

    数据库数据恢复环境 Oracle数据库ASM磁盘组有4块成员盘 数据库故障 分析 Oracle数据库ASM磁盘组掉线 ASM实例无法挂载 用户联系我们要求恢复oracle数据库 数据库数据恢复工程师拿到磁盘后 先将所有磁盘以只读方式进行扇区
  • 第六天 01-hydra工具windows远程桌面的密码爆破

    windows远程桌面的密码爆破 概述 RDP是Windows的远程桌面协议 所占用的端口默认为3389 这个是可以修改的 要求 我们要暴力破解3389号端口的前提是对方的3389号端口是开放的 爆破工具 kali使用hydra 九头蛇 工
  • python文件开头两行#!/usr/bin/python和# -*- coding:utf-8 -*-解释以及Pycharm自动创建py文件头部信息

    我们常见到python文件的前两行都会写上如下两行代码 下面我分别解释这两条语句的意义 并介绍pycharm中自动生成py文件头部信息的方法 usr bin env python coding utf 8 或者 usr bin python
  • vs2019 中编译和使用 protobuf 库

    背景 protobuf 是一种跨平台的序列化结构数据的方法 可用于网络数据传输及存储 本文对使用 vs2019 编译 protobuf 库文件进行说明 相关代码及安装文件均来自官网下载 VS2019 编译 protobuf 生成 sln 工
  • 实时语音通讯技术的应用场景与挑战

    随着互联网和移动通信技术的快速发展 实时语音通讯技术已经成为人们日常生活和工作中不可或缺的一部分 实时语音通讯技术可以让人们通过网络进行实时语音通话 不受时间和地点的限制 带来了极大的便利和效率提升 本文将探讨实时语音通讯技术的应用场景和挑
  • Java并发之ThreadLocal源码分析(第二篇:添加元素)

    前言 两个与添加元素相关的方法 initialValue 用于初始化一个默认值 set 用于添加一个元素 set 方法分析 public void set T value Thread t Thread currentThread Thre
  • Pycharm运行unittest报错ModuleNotFoundError: No module named ‘pytest‘解决

    使用unittest未import pytest相关功能语句 在pycharm中右键run的时候报错 Traceback most recent call last File B Application pycharm PyCharm 20
  • FCK配置中文版(转自网络,未知来源)

    1 FCKConfig CustomConfigurationsPath 自定义配置文件路径和名称 2 FCKConfigFCKConfig EditorAreaCSS FCKConfig BasePath css fck editorar
  • MATLAB 图像平移操作(转)

    function outImage immove inImage Tx Ty m n size inImage Tx fix Tx Ty fix Ty move xif Tx lt 0 inImage imcrop inImage abs
  • Android 下拉选择框自定义view

    首先来看一下实现的效果 基本思路 继承PopupWindow的自定义View 说明 下图这部分自己布局 本文中主要说明的是点击某个分类显示的下拉实现 第一步 自定义 SpinnerPopuwindow继承PopupWindow Create
  • Markdown编写公式

    文章目录 Markdown编写公式 一 修改设置 二 希腊字母 三 一些数据结构 四 定界符 五 可变大小的符号 六 函数名称 七 二进制运算符和关系运算符 八 箭头符号 九 其他特殊符号 十 上下标 十一 矩阵 十二 分段函数 1 分段函
  • 集群篇-k8s介绍

    TOC 集群篇 k8s介绍 一 集群业务介绍 集群篇 服务器的搭建 集群的管理 运维 1 集群业务介绍 集群 k8s及自动化部署 服务器的预警监控功能 二 k8s 集群部署 K8S部署 DevOps 百度云地址 提取码 1111 1 k8s
  • 扫雷(C语言版)

    引言 扫雷游戏是一款经典的逻辑游戏 它不仅考验玩家的观察力和决策能力 还能带给玩家休闲娱乐的乐趣 本文将介绍一个简单的扫雷游戏的实现 帮助读者了解这款游戏的基本原理和代码实现 一 游戏规则简介 扫雷游戏的目标是找到所有没有地雷的方块 同时避
  • 服务器操作系统的实时性,对虚拟化操作系统进行实时性调度的解决方案介绍

    图3 中断实时响应分析 虚拟操作系统应用中常会有以下3类事件的实时响应需要考虑 0类事件 底层硬件中断需要得到上层某个Domain的快速响应处理 1类事件 Domain GuestOS 之间的通信事件需要被另一个Doamin快速处理 2 类

随机推荐

  • Portal_JS,用JS实现的Portlet效果

    有一年多没有关顾自己的博客了 然还有部分博友造访 令我万分感动 现在发布一下最近的一个组件 PortletWin package ElementUtils js author 熊水林 xionglb 163 com version 版权所有
  • Linux驱动-编译驱动模块的Makefile和脚本

    Makefile内容 ARCH arm CROSS COMPILE arm poky linux gnueabi 也可以同时编译多个模块 obj m export symbol o export symbol1 o export symbo
  • Shell函数的7种用法介绍

    1 在shell文件内部定义函数并引用 复制代码代码如下 shell function cat factorial sh bin bash function factorial factorial 1 for i 1 i lt 1 i do
  • 为什么每家公司都需要协作工具?

    前言 企业很多时候 和一个人是一样一样一样的 经营 也和一个人的成长是一样一样一样的 作为企业的管理者 如何健康存续的运营公司 是每个合格CEO不断成长路径上的必修课 就像 谈谈SaaS创业和企业服务的常识 中提到的企业服务常识 今天和大家
  • MySQL要不要容器化?能不能运行在Docker?

    文章目录 概述 数据安全问题 性能问题 状态问题 资源隔离方面 MySQL 其实也是容器化 概述 容器的定义 容器是为了解决 在切换运行环境时 如何保证软件能够正常运行 这一问题 目前 容器和 Docker 依旧是技术领域最热门的词语 无状
  • 嵌入式系统之KPN网络图

    specification model 推荐用于并行程序 进程通过无线规格的FIFO队列进行通信 读 具有破坏性和阻塞 一个进程停留在waiting队列直到它被另外一个进程的通道传输 写 非阻塞 一个进程不能阻止一个通道传输数据 KPN图像
  • MySQL数据库迁移详细步骤

    转载自 http sofar blog 51cto com 353572 1598364 一 背景简介 1 问题描述 由于机房搬迁 需要对后台DB服务器进行迁移 同时为了保证在数据迁移过程中 对线上业务不造成影响 并能够做到秒级切换 如果我
  • 腾讯云服务器部署使用教程_新手入门

    腾讯云服务器使用教程包括注册账号实名认证 选择云服务器CVM或轻量应用服务器CPU内存带宽和系统盘配置 安全设置和云服务器远程连接 安全组端口开通教程 云服务器环境部署以搭建网站为例手把手网站上线 云服务器文件传输和数据备份以及技术支持等详
  • 第1章 Python简介(1)

    第1章 Python简介 Python语言是一种面向对象的解释型高级编程语言 由Guido van Rossum于1989年底发明 第一个公开发行版发行于1991年 目前 Python语言有两个版本 Python 2 x和Python 3
  • stm32控制OLED显示实验(IIC、汉字显示)

    OLED c include stm32f10x h include OLED Font h 引脚配置 define OLED W SCL x GPIO WriteBit GPIOB GPIO Pin 10 BitAction x defi
  • 几种求最小公倍数的方法

    http blog csdn net iwm next article details 7450424 这是原链接 谢谢该博主的分享 写的很不错哦
  • cocoapods的安装与使用心得整理

    一 安装命令 sudo gem install cocoapods pod setup 这个时候需要耐心的等待哈 如果网络慢的话 需要等更久呢 每一行命令都会有回应的 如果遇到报错如下 Error fetching https rubyge
  • range 函数生成可迭代对象,for_in

    range 函数生成可迭代对象 for in range start stop step start 可选参数 默认为 0 表示序列起点 stop 必选参数 表示序列终点 不包括终点 step 可选参数 序列的步长 默认为 1 print
  • 软件自动化测试基本流程(附流程图)

    自动化测试与软件开发过程从本质上来讲是一样的 无非是利用自动化测试工具 相当于软件开发工具 经过对测试需求的分析 软件过程中的需求分析 设计出自动化测试用例 软件过程中的需求规格 从而搭建自动化测试的框架 软件过程中的概要设计 设计与编写自
  • ubuntu安装python3.6 software-properties-common

    gnupg 破坏 software properties common lt 0 96 24 3 but sudo apt install only upgrade gnupg
  • DKVMN学习

    文章目录 前言 Memory Augmented Neural Network MANN for Knowledge Tracing DKVMN模型 实验结果 DKVMN总结 DKVMN BORUTA模型 SKVMN模型 Deep IRT模
  • background-position设置百分比“失效了”!!

    1 background position设置百分比的计算原理 当指定百分比值的时候 实际上执行了以下的计算公式 该公式可以用数学方式定义图片和容器相对位置重合 这是当background size auto 时 百分比有效 contain
  • 组装一台1u服务器

    1 服务器的内存条都是带校验功能的 2 服务器cpu可以多个 一般电脑只有一个
  • NAS个人云存储服务器搭建

    NAS Network Attached Storage 网络附属存储 通过网络提供数据访问服务 可以理解为长时间连网的存储设备 其功能基本和市面上的各种云盘相似 它以数据为中心 将存储设备与服务器彻底分离 集中管理数据 从而释放带家 提高
  • layui 时间选择器laydate开始时间结束时间限制,及设置默认时分秒

    这个时间控件实现了 开始时间和结束时间都不得超过当前时间 结束时间大于开始时间并且小于当前时间 开始时间默认时分秒为00 00 00 结束时间默认时分秒为23 59 59 其他官方自带功能 项目中的需求是 结束时间要大于开始时间 包括时分秒