如下图,翻页不选择也不关闭。点击指定年份时再选择和关闭控件

1、代码如下

// 默认没有选择,把判断赋值当前时间
var iYearCode = parseInt(new Date().getFullYear().toString());
// 如果上一次选择了,但手动删除或修改了,再把判断赋值当前时间
$("#yearCode").bind("input propertychange",function(event){
var yearCode = $("#yearCode").val();
if(undefined == yearCode || null == yearCode || yearCode.length < 4) {
iYearCode = parseInt(new Date().getFullYear().toString());
} else {
iYearCode = parseInt(yearCode);
}
});
layui.laydate.render({
elem: '#yearCode'
,type:'year'
,showBottom: false
,change: function(value, date, endDate){
// 获取翻页或点击选择年份数据
var iValue = parseInt(value);
// 获取一页年份列表个数,翻页的话,两个年份肯定等于列表年份个数长度
var year_list = $(".laydate-year-list")[0].getElementsByTagName("li").length; // 如果上一次选择和这次选择之间不超过年份列表个数,那么就是点击选择指定年份
if(Math.abs(iYearCode - iValue) < year_list) {
$('#yearCode').val(value);
$('.layui-laydate').remove();
}
// 赋值给判断
iYearCode = iValue;
}
});

2.1、或者:

 laydate.render({
elem: '#archiveYear',
max: new Date().getFullYear().toString(),
type: 'year',
value: new Date().getFullYear().toString(),
isInitValue: true,
trigger: 'click',
showBottom: false,
position: 'fixed',
change: function (value, date, endDate) {
if (this.min.year <= date.year && date.year <= this.max.year) {
$(this.elem).val(value);
} else if (date.year < this.min.year) {
$(this.elem).val(this.min.year);
} else if (date.year > this.max.year) {
$(this.elem).val(this.max.year);
}
if (undefined == this.myYear) {
this.myYearListLength = $(".laydate-year-list")[0].getElementsByTagName("li").length;
if (this.value) {
this.myYear = (parseInt(this.value) - (this.myYearListLength - 1)/2) + "年 - " + (parseInt(this.value) + (this.myYearListLength - 1)/2) + "年";
} else {
this.myYear = (new Date().getFullYear() - (this.myYearListLength - 1)/2) + "年 - " + (new Date().getFullYear() + (this.myYearListLength - 1)/2) + "年";
}
if ($('.laydate-set-ym').find('span[lay-type="year"]').html() == this.myYear) {
$("#layui-laydate" + $(this.elem).attr('lay-key')).remove();
} else {
this.myYear = $('.laydate-set-ym').find('span[lay-type="year"]').html();
}
} else {
if ($('.laydate-set-ym').find('span[lay-type="year"]').html() == this.myYear) {
$("#layui-laydate" + $(this.elem).attr('lay-key')).remove();
} else {
this.myYear = $('.laydate-set-ym').find('span[lay-type="year"]').html();
}
}
}
});

2.2、方法抽取:

 laydate.render({
elem: '#archiveYear',
max: new Date().getFullYear().toString(),
type: 'year',
value: new Date().getFullYear().toString(),
isInitValue: true,
trigger: 'click',
showBottom: false,
position: 'fixed',
change: function (value, date, endDate) {
laydateYearSetValue(this, value, date);
}
}); /**
* laydate的year类型设值,在change方法调用
*
* @param thiz change里面的this
* @param value change的参数value
* @param date change的参数date
*/
function laydateYearSetValue(thiz, value, date) {
if (thiz.min.year <= date.year && date.year <= thiz.max.year) {
$(thiz.elem).val(value);
} else if (date.year < thiz.min.year) {
$(thiz.elem).val(thiz.min.year);
} else if (date.year > thiz.max.year) {
$(thiz.elem).val(thiz.max.year);
}
if (undefined == thiz.myYear) {
thiz.myYearListLength = $(".laydate-year-list")[0].getElementsByTagName("li").length;
if (thiz.value) {
thiz.myYear = (parseInt(thiz.value) - (thiz.myYearListLength - 1)/2) + "年 - " + (parseInt(thiz.value) + (thiz.myYearListLength - 1)/2) + "年";
} else {
thiz.myYear = (new Date().getFullYear() - (thiz.myYearListLength - 1)/2) + "年 - " + (new Date().getFullYear() + (thiz.myYearListLength - 1)/2) + "年";
}
if ($('.laydate-set-ym').find('span[lay-type="year"]').html() == thiz.myYear) {
$("#layui-laydate" + $(thiz.elem).attr('lay-key')).remove();
} else {
thiz.myYear = $('.laydate-set-ym').find('span[lay-type="year"]').html();
}
} else {
if ($('.laydate-set-ym').find('span[lay-type="year"]').html() == thiz.myYear) {
$("#layui-laydate" + $(thiz.elem).attr('lay-key')).remove();
} else {
thiz.myYear = $('.laydate-set-ym').find('span[lay-type="year"]').html();
}
}
}

laydate年份选择,关闭底框,点击指定年份就选择然后关闭控件,翻页不选择也不关闭控件的更多相关文章

  1. gridView AspNetPager 翻页时 弹出窗体关闭报错

    gridView AspNetPager 翻页后,你右击刷新或F5会发现弹出一个刷新页面. 这是因为默认翻页都是用dopostback方式回发的.因为这时的页面已经不是原来的页面.所以会弹出提示. 这 ...

  2. (java)selenium webdriver学习,选择模块,点击下一页,获取当前url

    selenium webdriver学习,选择模块,点击下一页,获取当前url 查找下一页有多种方法,这里列举两种: isSelected()函数用于判断是否点击选中,返回Boolean类型 impo ...

  3. 原创:用VBA实现将鼠标选择的单元格按照指定格式合并并复制到剪切板

    原创:用VBA实现将鼠标选择的单元格按照指定格式合并并复制到剪切板 一.主要实现以下功能:1.用鼠标选择单元格(可谓连续单元格,也可为不连续的)后,按照要求格式“证件号码:+选定内容+“,”+”选定内 ...

  4. [Selenium]点击下拉框之后,从下拉列表选择元素进行点击很容易失败

    点击下拉框之后,下拉列表会显示出来,但是有时候下拉列表会很快就消失掉,导致后面选择元素的时候会失败. 像这种情况,需要将鼠标移动到下拉列表上,使下拉列表维持显示,然后才选择元素进行点击. 将鼠标移动到 ...

  5. 如果没有指定Cookie的时效,那么默认的时效是。(选择1项)

    如果没有指定Cookie的时效,那么默认的时效是.(选择1项) A.一天 B. 永不过期 C.会话级别 D.一分钟 解答:C 这是API的原文:By default, -1 indicating th ...

  6. 简易数据分析 08 | Web Scraper 翻页——点击「更多按钮」翻页

    这是简易数据分析系列的第 8 篇文章. 我们在Web Scraper 翻页--控制链接批量抓取数据一文中,介绍了控制网页链接批量抓取数据的办法. 但是你在预览一些网站时,会发现随着网页的下拉,你需要点 ...

  7. easyUI datagrid中checkbox选中事件以及行点击事件,翻页之后还可以选中

    DataGrid其中与选择,勾选相关 DataGrid属性:singleSelect boolean 如果为true,则只允许选择一行. false ctrlSelect boolean 在启用多行选 ...

  8. 在页面中添加两个 <select> 标签,用来显示年份和月份;同时添加两个 <ul> 标签,一个用来显示星期,另一个用来显示日期 在 JavaScript 脚本中动态添加年份和月份,获取当前日期的年份

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 Date 对象,在页面上显示一个万年历.选择不同的年份和月份,在页面中显示当前月的日历 实现思路: 在页面中添加两个 <s ...

  9. Atitit.ui控件---下拉菜单选择控件的实现select html

    Atitit.ui控件---下拉菜单选择控件的实现select   html 1. 调用& model的实现 1 2. -----select.jsp------ 1 1. 调用& m ...

随机推荐

  1. LOJ P10114 数星星 stars 题解

    每日一题 day7 打卡 Analysis 树状数组 由于题目中给的数据是按y轴排序,我们只需构建x轴的树状数组,也就是说我们只需统计星星i之前一共有多少个x坐标小于或等于Xi的星星,这个数值也就是星 ...

  2. Oracle 修改SID --不建议修改

    1.登录数据库查看SID select instance_name,status from v$instance; 2.关闭数据库 shutdown immdiate; 3.修改/etc/oratab ...

  3. [AGC028B]Removing Blocks 概率与期望

    考虑算每一个位置在所有情况的期望值乘以全排列似乎就是答案. 那么对于 $i$,如果要由 $j$ 来贡献的话就要满足 $j$ 在 $i....j-1$ 之前先拿. 而在拿 $j$ 时,先于 $i...j ...

  4. [luogu] 斐波那契数列

    https://www.luogu.org/problemnew/show/P1962 矩阵快速幂加速 #include <bits/stdc++.h> using namespace s ...

  5. 数据结构实验之图论四:迷宫探索【dfs 求路径】

    分析:起点已知,开个数组来存放路径,注意 vis 数组要初始化!另外,不能忘记了题目还要求回去的路径,只要在 dfs 之后加上就可以了. #include <bits/stdc++.h> ...

  6. 在vscode里面光标跳跃的问题

    https://tieba.baidu.com/p/5242680781?red_tag=2439355674 卸载 JS-CSS-HTML Formatter就可以了.卸载完还要加载一下哦

  7. elasticsearch alias

    索引别名API允许使用一个名字来作为一个索引的别名,所有API会自动将别名转换为实际的索引名称. 别名也可以映射到多个索引,别名不能与索引具有相同的名称.别名可以用来做索引迁移和多个索引的查询统一,还 ...

  8. C语言联合

    联合使用关键字union,表示的一种量,只占用一块内存,具体如何占用取决于类型最大的那个.比如int和float会选用float. 联合也可以和结构体结合起来用,也可以赋值,通过.属性名的方式指定初始 ...

  9. pom.xml中properties作用

    可以在properties下声明相应的版本信息,然后在dependency下引用的时候用${spring-version}就可以引入该版本jar包了 <properties> <sp ...

  10. Bitmap添加水印效果

    package com.loaderman.customviewdemo; import android.app.Activity; import android.graphics.Bitmap; i ...