.点击年份马上关闭窗口并且赋值

html代码:

<div class="layui-form-item">
<label class="layui-form-label">年份</label>
<div class="layui-input-block">
<input type="text" id="year" name="year" class="layui-input">
</div>
</div>

jq代码:

//这个js是用于按年份查询的日期控件

layui.use(["laydate"], function () {

var laydate = laydate = layui.laydate;
laydate.render({
elem: '#year',// 指定元素
type: 'year',//自由选择时间
format: 'yyyy年',
// min: "",
// max: 7,
showBottom: false,
change: function(value, date, endDate){ //点击后事件回调
$('#year').val(value);//点击完赋值
$('#layui-laydate1').remove();//立即关闭窗口
}
});
});

2.起始月份

html代码:

<div class="layui-form-item" id="m" style="display:none;">
<label class="layui-form-label">起始月份</label>
<div class="layui-input-block">
<input type="text" id="month" name="month" class="layui-input">
</div>
</div>

js代码:

laydate.render({
elem: '#month'
,type: 'month'
,format:'M月'
,theme: '#molv'
,range: true
});

layui之laydate的更多相关文章

  1. layui ri laydate的常规使用,并且日期最大不能超过当前日期

    laydate的常规使用,分为两种方式实现日期组件 一.在 layui 模块中使用 下载layui   地址 :https://www.layui.com/  引入资源路径 js 和 css 通过下面 ...

  2. layUI中layDate控件兼容性问题(手机端没有效果,不显示)

    使用layDate插件发现在PC端无问题,然而在适配移动端时,发现点击input时,laydate渲染出的时间控件有时候没有反应,后发现只需在render里加入trigger: 'click',即可以 ...

  3. 日期时间组件 - layui.laydate

    全部参数 一.核心方法:laydate(options); options是一个对象,它包含了以下key: '默认值' { elem: '#id', //需显示日期的元素选择器 event: 'cli ...

  4. layui(一)——layDate组件常见用法

    和 layer 一样,我们可以在 layui 中使用 layDate,也可直接使用 layDate 独立版,可按照实际需求来选择.options整理如下: layui.use('laydate', f ...

  5. 关于layui的日期和时间组件laydate闪屏的坑

    https://blog.csdn.net/liangwenli_/article/details/82786713 jsp页面: <input type="text" cl ...

  6. layui 时间插件laydate中动态设置改变min和max值

    <div class="layui-inline"> <label class="layui-form-label">申请时间</ ...

  7. layui中时间插件laydate的使用

    1.加载layui.js 2.html部分 <div class="layui-inline"> <label class="layui-form-la ...

  8. 日期控件,layui

    <link rel="stylesheet" href="<%=path%>/layui/css/layui.css" type=" ...

  9. layui框架部分功能介绍

    注意:代码的所有功能都没有导入layui的css样式 一,分页功能 layui框架分页使用,其实layui分页非常简单只需要传入一个总页数就可以很好运用这个功能 下面就看一下我对layui框架分页的介 ...

随机推荐

  1. 使用css鼠标移动到图片放大效果

      <!DOCTYPE html>  <html>      <head>          <meta charset="UTF-8"& ...

  2. Centos7 Python2 升级到Python3

    1. 从Python官网到获取Python3的包, 切换到目录/usr/local/src wget https://www.python.org/ftp/python/3.7.2/Python-3. ...

  3. 今日头条 SEO 研究,值得深思的 5 个问题

    在做SEO的过程中,实际上,我并不是“技术挂”更多的是基于搜索原理与大量的实战,总结相关的经验,这么多年,经常养成一个小习惯,总是记录一些工作中遇到的一些小问题与小技巧. 特别是2017年,12月份开 ...

  4. openlayers添加弹出框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. springMVC请求访问的整个过程

    //以上个随笔(springMVC项目配置文件)为基础,详述springMVC请求的整个过程流向 web.xml                                            ...

  6. 论文阅读笔记(六)【TCSVT2018】:Semi-Supervised Cross-View Projection-Based Dictionary Learning for Video-Based Person Re-Identification

    Introduction (1)Motivation: ① 现实场景中,给所有视频进行标记是一项繁琐和高成本的工作,而且随着监控相机的记录,视频信息会快速增多,因此需要采用半监督学习的方式,只对一部分 ...

  7. Sentence by defender

    也许,人在旅途,不是你看清了多少事,而是你看轻了多少事.

  8. 爬取漫画DB上的JoJo的奇妙冒险 第七部 飙马野郎

    SBR是JOJO系列我最喜欢的一部,所以今天把漫画爬取到本地,日后慢慢看. import re import time import requests from requests import cod ...

  9. day03_2spring3

    SSH整合(续) 一.spring整合hibernate:有hibernate.cfg.xml 前提:导入jar包,在前面已经介绍了jar包的整合,我们只需要将整合的所有jar包导进去即可. 1.创建 ...

  10. nodejs使用promise实现sleep

    个人博客 地址:http://www.wenhaofan.com/article/20181120180225 let sleep = function (delay) { return new Pr ...