layui 自定义日期选择器今日、昨日 、本周、本月、上个月等

1、layui 日期选择器
laydate日期选择器
<div class="layui-input-inline"><input class="layui-input" id="dateTime" placeholder="日期范围">
</div><script>
layui.use(['laydate'], function () {laydate.render({elem: '#dateTime',type: 'date',format: 'yyyy-MM-dd',range: true,trigger: 'click',done: function (val, stdate, ovdate) {}});
});

正常显示

2、自定义laydate.js
文件下载地址
链接:https://pan.baidu.com/s/1-revW0FTwOprM361e-1eLw 
提取码:qkntvar startDate1 = new Date(new Date().setDate(1));
//定义接收上个月的第一天和最后一天
var startDate2 = new Date(new Date(new Date().setMonth(new Date().getMonth() - 1)).setDate(1));
var endDate2 = new Date(new Date().setDate(0));
var now = new Date(); //今日
var nowDayOfWeek = now.getDay(); //今天本周的第几天
laydate.render({elem: this, //指定元素range: true,type: 'date',format: 'yyyy-MM-dd',trigger: 'click', //采用click弹出value: '',extrabtns: [{id: 'today', text: '今日', range: [now, now]},{id: 'yesterday',	text: '昨日', range: [new Date(new Date().setDate(new  Date().getDate() - 1)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'week',text: '本周',range: [new Date(new Date().setDate(new Date().getDate() - nowDayOfWeek + 1)), new Date()]},{id: 'lastday-7',text: '过去7天',range: [new Date(new Date().setDate(new Date().getDate() - 7)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'lastday-30',text: '过去30天',range: [new Date(new Date().setDate(new Date().getDate() - 30)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'thismonth', text: '本月', range: [startDate1, now]},{id: 'lastmonth', text: '上个月', range: [startDate2, endDate2]}],done: function (val, stdate, ovdate) {// 确认选择事件后调用}
});

效果图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/642331.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

QT upd测试

QT upd测试 本次测试将服务器和客户端写在了一个工程下&#xff0c;代码如下 widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include<QUdpSocket> #include<QTimer>QT_BEGIN_NAMESPACE namespace Ui { class Widget; } QT_END_NAMESPACE…

编程入门:五个你必须知道的编程常识

常识1&#xff1a;编程不仅仅是写代码 当我们谈论编程时&#xff0c;大多数人首先想到的是写代码。这是正确的&#xff0c;但并不完整。编程不仅仅是写代码&#xff0c;而是解决问题的一种方式。编程是一种工具&#xff0c;我们使用它来创建能够解决特定问题的产品和服务。 比…

qmt和ptrade有什么区别?国内免费量化交易软件精选:让你轻松上手量化交易!

QMT 和 PTrade 是两个不同的平台&#xff0c;具有不同的功能和特点。 QMT&#xff08;Quantitative Market Trading&#xff09;是一种量化交易平台&#xff0c;主要面向专业的量化交易员和机构交易员。它提供了一系列的工具和功能&#xff0c;帮助交易员进行定量分析、模型开…

C#用DateTime.Now静态属性返回日期的星期信息

目录 一、使用的方法 1.Now属性 2.ToString方法 二、示例 使用DateTime结构的Now静态属性&#xff0c;可以方便地获取系统日期信息。调用时间对象的ToString方法&#xff0c;在该方法的参数中添加适当的格式化字符串&#xff0c;将返回日期的星期信息。 一、使用的方法 1…

【Linux】安装n卡驱动,美化gnome

文章目录 1.换源以及更新&#xff08;十分重要不要跳过&#xff01;&#xff09;2.安装依赖&#xff08;十分重要不要跳过&#xff01;&#xff09;3. 安装n卡驱动独显与核显切换nvidia-settings消失忘记安装依赖无法进入图形化界面的急救命令行无响应办法 gnome美化安装-tweak…

【网络安全】-基本工具msf

secure 1、有此漏洞的目标主机2、无此漏洞的目标主机&#xff08;常用&#xff09; ps.本着兴趣爱好&#xff0c;加强电脑的安全防护能力&#xff0c;并严格遵守法律和道德规范。msf&#xff08;metasploit framework&#xff09;是一个开源的渗透测试框架&#xff0c;用于开发…

JAVA:OFD Reader Writer 开源库技术解析

1、简述 OFD Reader & Writer 是一个由开源社区推动的 OFD 文件处理库&#xff0c;它旨在提供对 OFD 格式文件的读取和写入功能。这一开源项目为开发者提供了强大而灵活的工具&#xff0c;使得在应用程序中处理和生成 OFD 文件变得更加容易和高效 开源地址&#xff1a;htt…

【RF FILTER 仿真】滤波器 Ansys Electronics not ADS

第一&#xff0c;声明 全网搜索&#xff0c;用这个HFSS继承的介绍非常少&#xff0c;并且没有什么指导意义。所以有必要写一下&#xff0c;就像之前的xpedition,总要挑战一下吧。本文仅仅和大家学习研究&#xff0c;对比ADS体会一下差别。 第二&#xff0c;记录直接开始&…

【服务器】安装Docker环境

目录 &#x1f33a;【前言】 &#x1f33c;1. 打开Xshell软件 &#x1f33b;2. 安装Docker环境 ①&#xff1a;下载docker.sh脚本 ②&#xff1a;列出下载的内容 ③&#xff1a;执行一下get-docker.sh文件&#xff0c;安装docker ④&#xff1a;运行docker服务 ⑤&…

openEuler操作系统安装+部署+配置

目录 一、下载 二、创建虚拟机实例 三、安装部署 四、配置OpenEuler22.03 1、登录账号 2、Xshell建立连接 3、关闭防火墙及SELinux 4、修改主机名修改root密码 5、配置yum源 6、查看网卡配置 7、用yum下载软件 8、网络配置 1&#xff09;nmtui --图形化界面配置 …

攸信UMS工业配送AMR F1引领智能物流发展,侨智大会瞩目焦点

近日&#xff0c;由中国侨联、福建省人民政府共同主办的第一届中国侨智发展大会在福州开幕。本次大会以“五洲聚‘福’汇侨智&#xff0c;同心共圆中国梦”为主题&#xff0c;立足福建、服务全国、面向海外&#xff0c;吸引了来自37个国家和地区的一千余名海内外嘉宾参会。 01|…

98.乐理基础-记号篇-装饰音记号(六)倚音

内容参考于&#xff1a;三分钟音乐社 上一个内容&#xff1a;97.乐理基础-记号篇-装饰音记号&#xff08;五&#xff09;颤音-CSDN博客 从历史的发展上来讲&#xff0c;倚音本质上是分为短倚音 和 长倚音这两种类型&#xff0c;但是长倚音确实是一个目前看上去没有什么意义的…

火车票车票查询-Python

一、相关代码 # Time: 2024/1/22 20:24 # Author: 马龙强 # File: 实现12306查票购票.py # software: PyCharm """网址&#xff1a;https://www.12306.cn/index/ 数据&#xff1a;车次信息 查票链接&#xff1a;https://kyfw.12306.cn/otn/leftTicket/queryE?…

常用界面设计组件 —— 数字输入和显示组件

2.3 数字输入和显示组件2.3.1 QSpinBox 与 QDoubleSpinBox2.3.2其它数值输入和显示组件 2.3 数字输入和显示组件 2.3.1 QSpinBox 与 QDoubleSpinBox QSpinBox用于整数的显示和输入&#xff0c;一般显示十进制 数&#xff0c;也可以显示二进制、十六进制数&#xff0c;而且可以…

GEE错误——Image (Error) Image.select: Pattern ‘SR_B1‘ did not match any bands.

错误 我花了大量时间试图解决这个问题,但我找不到解决办法。开发人员和小组成员,我需要你们的帮助,这是我学习项目的一部分。 原始代码链接: https://code.earthengine.google.com/ccd8eb582aa520b970f4dee2d5118def Image (Error) Image.select: Pattern SR_B1 did …

02 MyBatisPlus核心功能之基于Mapper接口/Service接口实现CRUD+分页查询

项目结构&#xff1a; 1.1 Insert方法 // 插入一条记录 // T 就是要插入的实体对象 // 默认主键生成策略为雪花算法&#xff08;后面讲解&#xff09; //返回值是影响条数 int insert(T entity);1.2 Delete方法 // 根据 entity 条件&#xff0c;删除记录 int delete(Param(…

Python学习03—Python语法元素分析

一、程序的格式框架 1.1 代码高亮 代码高亮是Python编程环境根据代码不同含义&#xff0c;给予不同色彩标注的一种色彩辅组体系。在不同的代码编程环境中&#xff0c;代码高亮的表现形式各有不同。 1.2 缩进 缩进是一行代码开始前的空白区域&#xff0c;它用来表达程序的格式…

不同知识表示方法与知识图谱

目录 前言1 一阶谓词逻辑1.1 简介1.2 优势1.3 局限性 2 产生式规则2.1 简介2.2 优势2.3 局限性 3 框架系统3.1 简介3.2 优势3.3 局限性 4 描述逻辑4.1 简介4.2 优势4.3 局限性 5 语义网络5.1 简介5.2 优势5.3 局限性 结语 前言 知识表示是人工智能领域中至关重要的一环&#x…

vue3前端开发,生命周期函数的基础练习

vue3前端开发,生命周期函数的基础练习&#xff01; 下面先给大家看一个图片&#xff0c;帮助大家了解&#xff0c;vue3的生命周期函数&#xff0c;和旧版本vue2的生命周期函数&#xff0c;有什么变化。 如图所示&#xff0c;vue3里面&#xff0c;把前面2个函数&#xff0c;混在…

再不学Python就晚了!——2023年度总结:市场需求最大的8种编程语言!

众所周知&#xff0c;编程语言的种类实在是太多了。直到现在&#xff0c;经常还会看到关于编程语言选择和学习的讨论。 虽说编程语言有好几百种&#xff0c;但实际项目使用和就业要求的主流编程语言却没有那么多。 大家可能也会好奇&#xff1a;现如今就业市场上到底什么编程…