因项目需求需要多个日期,然后点击日期就会出现闪现的情况,导致选择不了日期

html代码

 <table class="form">
<tr>
<th class="formTitle">开始日期:</th>
<td class="formValue" colspan="2">
<input id="StartDate" name="StartDate" type="text" class="form-control layui-input test-item" placeholder="开始日期" /> </td>
</tr>
<tr>
<th class="formTitle">计划完成日期:</th>
<td class="formValue" colspan="2">
<input id="EndDate" name="EndDate" type="text" class="form-control layui-input test-item" placeholder="计划完成日期"/>
</td>
</tr>
<tr>
<th class="formTitle">实际完成日期:</th>
<td class="formValue" colspan="2">
<input id="ActualDate" name="ActualDate" type="text" class="form-control layui-input test-item" placeholder="实际完成日期"/>
</td>
</tr>
</table>

js

前提需要引入laydata.js

最重要的js

//同时绑定多个日期
lay('.test-item').each(function () { //test-item是引入日期所需要加入的类名
    laydate.render({ 
elem: this ,
trigger: 'click'
});
});
<script>   

    laydate.render({
elem: '#StartDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var now = new Date(laydate.now().replace("-", "/"));
var add = new Date(datas.replace("-", "/"));
add = new Date(add.getTime() + 30 * 24 * 60 * 60 * 1000);
if ((now.getMonth() + 1) < (add.getMonth() + 1)) {
end.min = laydate.now();
} else if ((now.getMonth() + 1) == (add.getMonth() + 1) && now.getDate() < add.getDate()) {
end.min = laydate.now();
}
else {
add = add.getFullYear() + "/" + (add.getMonth() + 1) + "/" + add.getDate();
end.min = add;
}
end.min = datas;
}, });
laydate.render({
elem: '#EndDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var max = new Date(datas.replace("-", "/"));
max = new Date(max.getTime() - 30 * 24 * 60 * 60 * 1000);
max = max.getFullYear() + "/" + (max.getMonth() + 1) + "/" + max.getDate();
start.max = datas;
start.min = laydate.now();
}, }); laydate.render({
elem: '#ActualDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var now = new Date(laydate.now().replace("-", "/"));
var add = new Date(datas.replace("-", "/"));
add = new Date(add.getTime() + 30 * 24 * 60 * 60 * 1000);
if ((now.getMonth() + 1) < (add.getMonth() + 1)) {
end.min = laydate.now();
} else if ((now.getMonth() + 1) == (add.getMonth() + 1) && now.getDate() < add.getDate()) {
end.min = laydate.now();
}
else {
add = add.getFullYear() + "/" + (add.getMonth() + 1) + "/" + add.getDate();
end.min = add;
}
end.min = datas;
}, }); </script>

laydata 点击日期闪现的更多相关文章

  1. Extjs DateTime 日期时间选择控件 (非点击日期强制选择) 支持4.0以上

    Extjs的日期控件,仅仅能支持到日期选择,对时间的选择并不完好.而网上下载的控件,都是基于Ext.form.dateField 开发.在选中日期后自己主动选择,并隐藏此选择窗体. 在经过一番改造后, ...

  2. JS双月份显示联动效果,点击日期浮出消息提示

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. JavaScript 日期选择器 Pikaday

    找一些插件的过程实在太痛苦了...好容易找到一个,赶紧记录下.免得以后重复浪费时间在这上面. 插件名:Pikaday github地址:https://github.com/dbushell/Pika ...

  4. my97日期控件

    http://www.seabroad.cn/cq/datepick/demo.htm 但是由于某些原因,担心这个网站不稳定,所以复制一下 一. 简介 1. 简介 目前的版本是:4.0 Prerele ...

  5. jsp日期插件My97DatePicker

    jsp日期插件My97DatePicker 强大的日期控件 使用方便简单 (2010-10-30 18:59:12) 转载▼ 标签: js javascript 日期插件 jsp it 分类: jqu ...

  6. 9.Android之日期对话框DatePicker控件学习

    设置日期对话框在手机经常用到,今天来学习下. 首先设置好布局文件:如图 xml对应代码 <?xml version="1.0" encoding="utf-8&qu ...

  7. My97DatePicker日期控件用法

    用法很简单,主要演示都在myDate.html  <meta http-equiv="content-type" content="text/html; chars ...

  8. HTML5 input新增的几种类型(数字、日期、颜色选取、范围)

    你可能已经听说过,HTML5里引入了几种新的input类型.在HTML5之前,大家熟知的input类型包括:text(输入框),hidden(隐藏域),submit(提交按钮)等.而HTML5到来之后 ...

  9. Highcharts使用=====通过指定日期显示曲线

    1.说明: 利用HighStock显示曲线,在右上角的日期间隔选择好日期后,重新请求后台数据,重新加载曲线. 2.实现方法: 在HighStock的rangeSelector中有一个属性inputDa ...

随机推荐

  1. 2018.08.28 codeforces600E(dsu on tree)

    传送门 一道烂大街的dsu on tree板题. 感觉挺有趣的^_^ 代码真心简单啊! 就是先处理轻儿子,然后处理重儿子,其中处理轻儿子后需要手动消除影响. 代码: #include<bits/ ...

  2. 2018.07.08 NOIP模拟 好数(线段树)

    好数 题目背景 SOURCE:NOIP2016-AHSDFZ T3 题目描述 我们定义一个非负整数是"好数",当且仅当它符合以下条件之一: 1. 这个数是 0 或 1 . 2. 所 ...

  3. hadoop学习笔记(四):hdfs常用命令

    一.hadoop fs 1.创建目录 [root@master hadoop-]# hadoop fs -mkdir /testdir1 [root@master hadoop-]# hadoop f ...

  4. py-函数基础

    定义: 函数是指将一组语句的集合通过一个名字(函数名)封装起来,要想执行这个函数,只需调用其函数名即可 特性: 1.减少重复代码2.使程序变的可扩展3.使程序变得易维护 函数参数 形参变量 只有在被调 ...

  5. GitHub 安装配置

    1:到 Github 注册 页面中注册,填写用户名.邮箱和密码 选择免费服务 步骤三可以根据自身喜好勾选或者直接跳过 2.1.2 创建远程仓库 创建完账号后,可以开始创建仓库 但是这里我们还没有验证邮 ...

  6. spss-非参数检验-K多个独立样本检验( Kruskal-Wallis检验)案例解析

    今天和大家一起探讨和分下一下SPSS-非参数检验--K个独立样本检验 ( Kruskal-Wallis检验). 还是以SPSS教程为例: 假设:HO:   不同地区的儿童,身高分布是相同的 H1: 不 ...

  7. QGIS+GH + MapServer

    拒绝描图,如何利用GH+QGIS完爆场地底图?http://www.sohu.com/a/251004986_657084 拒绝描图--爬取OSM数据绘制底图 所用软件 RHINO+GH\QGIS\G ...

  8. (最小生成树) Arctic Network -- POJ --2349

    链接: http://poj.org/problem?id=2349 Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 1371 ...

  9. # 20155204 2016-2017-2 《Java程序设计》第五周学习总结

    20155204 2016-2017-2 <Java程序设计>第五周学习总结 教材学习内容总结 Java中所有错误都会被打包为对象,运用try.catch,可以在错误发生时显示友好的错误信 ...

  10. spring获取webapplicationcontext,applicationcontext几种方法详解(转)

    方法一:在初始化时保存ApplicationContext对象 代码: ApplicationContext ac = new FileSystemXmlApplicationContext(&quo ...