她基于原生JavaScript精心雕琢,兼容了包括IE6在内的所有主流浏览器。她具备优雅的内部代码,良好的性能体验,和完善的皮肤体系,并且完全开源,你可以任意获取开发版源代码,一扫某些传统日期控件的封闭与狭隘。layDate本着资源共享的开发者精神和对网页日历交互无穷的追求,延续了layui一贯的简单与易用。她遵循LGPL协议,您可以免费将她用于任何个人项目。

  1. 版本 LayDate 1.1

  2. 作者:闲心贤

  3. github

在线实例

实例预览 layDate - js日期控件与时间插件演示

实例预览 layDate 日期选择器实例DEMO

引入文件

  1. <script src="laydate.js"></script>
复制

使用方法

  1. <input id="hello" class="laydate-icon">
  2. <script>
  3. laydate({
  4. elem: '#hello',
  5. event: 'focus'
  6. });
  7. </script>
复制

参数说明

一、核心方法:laydate(options);

  1. options是一个对象,它包含了以下key: '默认值'elem: '#id',
  2. //需显示日期的元素选择器
  3. event: 'click',
  4. //触发事件
  5. format: 'YYYY-MM-DD hh:mm:ss',
  6. //日期格式
  7. istime: false,
  8. //是否开启时间选择
  9. isclear: true,
  10. //是否显示清空
  11. istoday: true,
  12. //是否显示今天
  13. issure: true,
  14. 是否显示确认festival: true //是否显示节日
  15. min: '1900-01-01 00:00:00',
  16. //最小日期
  17. max: '2099-12-31 23:59:59',
  18. //最大日期
  19. start: '2014-6-15 23:00:00',
  20. //开始日期
  21. fixed: false,
  22. //是否固定在可视区域
  23. zIndex: 99999999,
  24. //css z-index
  25. choose: function(dates) { //选择好日期的回调
  26. }
复制

二、其它方法/属性

  1. laydate.v //获取laydate版本号
  2. laydate.skin(lib); //加载皮肤,参数lib为皮肤名
  3. /*
  4. layer.now支持多类型参数。timestamp可以是前后若干天,也可以是一个时间戳。format为日期格式,为空时则采用默认的“-”分割。
  5. 如laydate.now(-2)将返回前天,laydate.now(3999634079890)将返回2096-09-28
  6. */
  7. layer.now(timestamp, format); //该方法提供了丰富的功能,推荐灵活使用。
  8. laydate.reset(); //重设日历控件坐标,一般用于页面dom结构改变时。无参
复制

jQuery LayDate 日期控件的更多相关文章

  1. 【经验】Angularjs 中使用 layDate 日期控件

    layDate 控件地址:http://laydate.layui.com/ 前情:原来系统中使用的日期控件是UI bootstrap(地址:https://angular-ui.github.io/ ...

  2. jQuery Datepicker日期控件

    datepicker可以为bootstrap添加一个事件选择控件,适用于任何需要调用的场合,支持多种事件格式输出(比如:dd, d, mm, m, yyyy, yy等),是制作网页不可缺失的插件. R ...

  3. JQuery datepicker 日期控件设置

    datepicker控件可通过参数设置进行语言切换,以下可实现,系统所有日期控件默认为中文,在特定页面或者特定条件下可切换成英语!~ HTML: <!DOCTYPE html> <h ...

  4. jQuery UI 日期控件--datepicker

    在web开发中,日期的输入经常会遇到.我们会用的解决方法有: 1.自己写css和js,对日期进行控制:----有点浪费精力和时间: 2.用easyui插件中的日期插件来实现: 3.用juqery-ui ...

  5. 用jquery实现日期控件

    用jquery实现的日期控件,代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  6. Jquery + css 日期控件用法实例.zip

    /*==============================================================================** Filename:common.j ...

  7. 【前端控件】JQuery datepicker 日期控件设置

    datepicker控件可通过参数设置进行语言切换,以下可实现,系统所有日期控件默认为中文,在特定页面或者特定条件下可切换成英语!~ HTML: <!DOCTYPE html> <h ...

  8. laydate日期控件

    <!-- laydate 日期时间控件 下载地址 http://www.layui.com/laydate/ 这里用到版本为 layDate-v5.0.2 下载后将 laydate 文件夹放到项 ...

  9. JQuery EasyUI 日期控件 怎样做到只显示年月,而不显示日

    标题问题的答案在OSChina中 http://www.oschina.net/question/2282354_224401?fromerr=lHJTcN89 我还是把这个记录下来 ======== ...

随机推荐

  1. EL

  2. Leetcode-268 Missing Number

    #268.  Missing Number Given an array containing n distinct numbers taken from 0, 1, 2, ..., n, find ...

  3. SQL Server游标

    什么是游标 结果集,结果集就是select查询之后返回的所有行数据的集合. 游标则是处理结果集的一种机制吧,它可以定位到结果集中的某一行,多数据进行读写,也可以移动游标定位到你所需要的行中进行操作数据 ...

  4. OpenCascade B-Spline Basis Function

    OpenCascade B-Spline Basis Function eryar@163.com Abstract. B-splines are quite a bit more flexible ...

  5. HttpClient异步调用WEB服务

    using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Net ...

  6. Unity Shaders 第一个默认程序分析

    Unity Shaders 第一个默认程序 Shader "Custom/Shader" { Properties { _MainTex ("Base (RGB)&quo ...

  7. Hibernate4.0之HibernateSessionFactory源码详解

    import org.hibernate.HibernateException; import org.hibernate.Session; import org.hibernate.cfg.Conf ...

  8. 【开源】OSharp框架解说系列(2.1):EasyUI的后台界面搭建及极致重构

    OSharp是什么? OSharp是个快速开发框架,但不是一个大而全的包罗万象的框架,严格的说,OSharp中什么都没有实现.与其他大而全的框架最大的不同点,就是OSharp只做抽象封装,不做实现.依 ...

  9. 应用程序框架实战三十四:数据传输对象(DTO)介绍及各类型实体比较

    本文将介绍DDD分层架构中广泛使用的数据传输对象Dto,并且与领域实体Entity,查询实体QueryObject,视图实体ViewModel等几种实体进行比较. 领域实体为何不能一统江湖? 当你阅读 ...

  10. 【记录】AutoMapper Project To not support ResolveUsing

    示例代码: public List<OrderLineDTO> GetLinesForOrder(int orderId) { Mapper.CreateMap<OrderLine, ...