laydata 点击日期闪现
因项目需求需要多个日期,然后点击日期就会出现闪现的情况,导致选择不了日期
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 点击日期闪现的更多相关文章
- Extjs DateTime 日期时间选择控件 (非点击日期强制选择) 支持4.0以上
Extjs的日期控件,仅仅能支持到日期选择,对时间的选择并不完好.而网上下载的控件,都是基于Ext.form.dateField 开发.在选中日期后自己主动选择,并隐藏此选择窗体. 在经过一番改造后, ...
- JS双月份显示联动效果,点击日期浮出消息提示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript 日期选择器 Pikaday
找一些插件的过程实在太痛苦了...好容易找到一个,赶紧记录下.免得以后重复浪费时间在这上面. 插件名:Pikaday github地址:https://github.com/dbushell/Pika ...
- my97日期控件
http://www.seabroad.cn/cq/datepick/demo.htm 但是由于某些原因,担心这个网站不稳定,所以复制一下 一. 简介 1. 简介 目前的版本是:4.0 Prerele ...
- jsp日期插件My97DatePicker
jsp日期插件My97DatePicker 强大的日期控件 使用方便简单 (2010-10-30 18:59:12) 转载▼ 标签: js javascript 日期插件 jsp it 分类: jqu ...
- 9.Android之日期对话框DatePicker控件学习
设置日期对话框在手机经常用到,今天来学习下. 首先设置好布局文件:如图 xml对应代码 <?xml version="1.0" encoding="utf-8&qu ...
- My97DatePicker日期控件用法
用法很简单,主要演示都在myDate.html <meta http-equiv="content-type" content="text/html; chars ...
- HTML5 input新增的几种类型(数字、日期、颜色选取、范围)
你可能已经听说过,HTML5里引入了几种新的input类型.在HTML5之前,大家熟知的input类型包括:text(输入框),hidden(隐藏域),submit(提交按钮)等.而HTML5到来之后 ...
- Highcharts使用=====通过指定日期显示曲线
1.说明: 利用HighStock显示曲线,在右上角的日期间隔选择好日期后,重新请求后台数据,重新加载曲线. 2.实现方法: 在HighStock的rangeSelector中有一个属性inputDa ...
随机推荐
- 2018.09.18 atcoder Best Representation(kmp)
传送门 思路简单不知为何调试了很久. 显然要么分成n个(所有字符相同),要么分成1个(原字符串无循环节),要么分成两个(有长度至少为2的循环节). 一开始以为可以直接hash搞定. 后来wa了几次之后 ...
- 第七章 介词(La préposition )
法语中的介词是将两个同类或非同类的词连接在一起,把一个句中成分同另一个句子成分联系起来,并表明两者之间关系的词类.介词是一种无词性变化的词类. ★介词的形式 ()简单形式的介词,如: ()复合形式的介 ...
- POJ 3320 Jessica's Reading Problem (滑动窗口)
题意:给定一个序列,求一个最短区间,使得这个区间包含所有的种类数. 析:最近刚做了几个滑动窗口的题,这个很明显也是,肯定不能暴力啊,时间承受不了啊,所以 我们使用滑动窗口来解决,要算出所有的种数,我用 ...
- WPF MediaKit的一点问题
原版WPF MediaKit在捕获摄像头视频时,如果不使用640*480分分辨率输出,会出现NewVideoSample事件不被触发的问题. 经数日摸索,终于明白SetVideoCapturePara ...
- Reactor 模式在Netty中的应用
Reactor 模式在Netty中的应用 典型的Rector模式 mainReactor 服务端创建成功后,会监听Accept操作,其中ServerSocketchannel中的PipeLine中现在 ...
- Oracle 在not in中使用null的问题
http://www.linuxidc.com/Linux/2012-07/66212.htm 以前还专门小总结过一下Oracle中关于NULL的一些问题,碰巧今天在看书的过程中又看到了另外一个以前没 ...
- xlsxwriter
xlsxwriter是python中用来处理execl表格的库 参考
- python实现斐波那契数列笔记
斐波那契数列即著名的兔子数列:1.1.2.3.5.8.13.21.34.…… 数列特点:该数列从第三项开始,每个数的值为其前两个数之和,用python实现起来很简单: a=0 b=1 while b ...
- jQuery插件开发的五种形态小结
关于jQuery插件的开发自己也做了少许研究,自己也写过多个插件,在自己的团队了也分享过一次关于插件的课.开始的时候整觉的很复杂的代码,现在再次看的时候就清晰了许多.这里我把我自己总结出来的东西分享出 ...
- .NET Core 玩一玩 Ocelot API网关
.net 这几年国内确实不好过. 很多都选择转行.不过.net Core跨平台 开源之后 .社区的生态在慢慢建立.往好的趋势发展. 对于坚守在.NET战线的开发者来说 是个挺不错的消息. 特别是微软 ...