<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>日期</title>

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

    </head>

    <body>

        <blockquote class="layui-elem-quote">目前Layui中的日期组件还是layDate 1.1的改良版，它后续将会进行一次重写。</blockquote>

        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">

            <legend>顺便列举几个常用例子</legend>

        </fieldset>

        <div class="layui-form-pane" style="margin-top: 15px;">

            <div class="layui-form-item">

        <label class="layui-form-label">范围选择</label>

        <div class="layui-input-inline">

            <input class="layui-input" placeholder="开始日" id="LAY_demorange_s">

        </div>

        <div class="layui-input-inline">

            <input class="layui-input" placeholder="截止日" id="LAY_demorange_e">

        </div>

        </div>

        </div>

        <script src="../layui/layui.js"></script>

        <script>

			layui.use('laydate', function(){

			  var laydate = layui.laydate;

			  var start = {

//			    min: laydate.now(),

			    max: '2099-06-16 23:59:59'

			    ,istoday: false

			    ,choose: function(datas){

			      end.min = datas; //开始日选好后，重置结束日的最小日期

			      end.start = datas //将结束日的初始值设定为开始日

			    }

			  };

			  var end = {

			    min: laydate.now()

			    ,max: '2099-06-16 23:59:59'

			    ,istoday: false

			    ,choose: function(datas){

			      start.max = datas; //结束日选好后，重置开始日的最大日期

			    }

			  };

			  document.getElementById('LAY_demorange_s').onclick = function(){

			    start.elem = this;

			    laydate(start);

			  }

			  document.getElementById('LAY_demorange_e').onclick = function(){

			    end.elem = this

			    laydate(end);

			  }

			});

		</script>

    </body>

</html>

　　

二十八、layui的日历组件使用的更多相关文章

  1. Vue.js 源码分析(二十八) 高级应用 transition组件 详解

    transition组件可以给任何元素和组件添加进入/离开过渡,但只能给单个组件实行过渡效果(多个元素可以用transition-group组件,下一节再讲),调用该内置组件时,可以传入如下特性: n ...

  2. 微信小程序把玩（二十八）image组件

    原文:微信小程序把玩(二十八)image组件 image组件也是一个程序不可缺少的,可以这样说一个app中image组件随处可以看到,一般 image有两种加载方式第一种是网络图片第二种是本地图片资源 ...

  3. Bootstrap <基础二十八>列表组

    列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...

  4. VMware vSphere 服务器虚拟化之二十八 桌面虚拟化之安装View传输服务器

    VMware vSphere 服务器虚拟化之二十八 桌面虚拟化之安装View传输服务器 View 传输服务器用于管理和简化数据中心与在最终用户本地系统上检出使用的 View 桌面之间的数据传输.必须安 ...

  5. Web 前端开发人员和设计师必读文章推荐【系列二十八】

    <Web 前端开发精华文章推荐>2014年第7期(总第28期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...

  6. Citrix 服务器虚拟化之二十八 XenApp6.5发布文档内容

    Citrix 服务器虚拟化之二十八  XenApp 6.5发布文档内容 XenApp可发布以下类型的资源向用户提供信息访问,这些资源可在服务器或桌面上虚拟化: 1)  服务器桌面:发布场中服务器的整个 ...

  7. WCF技术剖析之二十八：自己动手获取元数据[附源代码下载]

    原文:WCF技术剖析之二十八:自己动手获取元数据[附源代码下载] 元数据的发布方式决定了元数据的获取行为,WCF服务元数据架构体系通过ServiceMetadataBehavior实现了基于WS-ME ...

  8. Bootstrap入门（二十八）JS插件5：工具提醒

    Bootstrap入门(二十八)JS插件5:工具提醒 工具提示在使用过程中比较常见,但是实现起来有些麻烦,而bootstrap则很好地解决了这个问题. 我们来写一个简单的实例 先引入CSS文件和JS文 ...

  9. mysql进阶(二十八)MySQL GRANT REVOKE用法

    mysql进阶(二十八)MySQL GRANT REVOKE用法   MySQL的权限系统围绕着两个概念: 认证->确定用户是否允许连接数据库服务器: 授权->确定用户是否拥有足够的权限执 ...

  10. JAVA之旅（二十八）——File概述，创建，删除，判断文件存在，创建文件夹，判断是否为文件/文件夹，获取信息，文件列表,文件过滤

    JAVA之旅(二十八)--File概述,创建,删除,判断文件存在,创建文件夹,判断是否为文件/文件夹,获取信息,文件列表,文件过滤 我们可以继续了,今天说下File 一.File概述 文件的操作是非常 ...

随机推荐

  1. 痞子衡嵌入式：微控制器CPU性能测试基准(EEMBC-CoreMark)

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是微控制器CPU性能测试基准CoreMark. 在嵌入式系统行业用于评价CPU性能指标的标准主要有三种:Dhrystone.MIPS.Co ...

  2. python基础6--面向对象基础、装饰器

    1.类 class Student: def __init__(self, name, grade): self.name = name self.grade = grade def introduc ...

  3. 第62章 EntityFramework支持 - Identity Server 4 中文文档(v1.0.0)

    为IdentityServer中的配置和操作数据扩展点提供了基于EntityFramework的实现.EntityFramework的使用允许任何EF支持的数据库与此库一起使用. 这个库的仓库位于这里 ...

  4. Dynamics 365-如何下载新版本的Tools

    最近新写了个Plugin,想注册到CRM中,但是使用旧版的PluginRegistration Tool的时候,总是加载不出来Plugin数据,所以寻思下载个最新版的Tool试试.现在下载Tools的 ...

  5. vue父子组件之间传值

    vue父子组件进行传值 vue中的父子组件,什么是父组件什么是子组件呢?就跟html标签一样,谁包裹着谁谁就是父组件,被包裹的元素就是子组件. 父组件向子组件传值 下面用的script引入的方式,那种 ...

  6. DVWA 黑客攻防演练（六）不安全的验证码 Insecure CAPTCHA

    之前在 CSRF 攻击 的那篇文章的最后,我觉得可以用验证码提高攻击的难度. 若有验证码的话,就比较难被攻击者利用 XSS 漏洞进行的 CSRF 攻击了,因为要识别验证码起码要调用api,跨域会被浏览 ...

  7. 关于Python, ftplib模块中的cwd()进入含中文目录失败的问题

    使用Python的ftplib模块连接ftp服务器时, 使用cwd()连接含中文的目录, 报错 : UnicodeEncodeError: 'latin-1' codec can't encode c ...

  8. Maven替换为国内仓库

    <mirror> <id>nexus-aliyun</id> <mirrorOf>central</mirrorOf> <name&g ...

  9. TreeView 节点拖拽

    public Form1() { InitializeComponent(); treeView1.AllowDrop = true; treeView1.ItemDrag += new ItemDr ...

  10. 【Intellij idea】spring中@Autowired注入失败

    @Autowired注入失败失败的解决办法? 现有的解决的方案是: 打开file-settings或者ctrl+alt+s -> Editor 然后在Inspections 点击搜索栏 输入Sp ...