她基于原生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. Ajax概要:

    Ajax概要: Ajax不是个全新的技术,它是多种技术合并在一起产生的,包括XHTML,CSS,JavaScript,XmlHttpRequest,XML,JSON,DOM等 优点:(这也解释了为何我 ...

  2. MongoDB 使用Index

    Index 能够提高查询的性能,如果没有Index,MongoDB必须扫描整个collection,从collection的第一个doc开始,直到最后一个doc,即使第一个doc之后的所有doc都不满 ...

  3. 前端MVC框架Backbone 1.1.0源码分析系列

    Backbone.js 是一个在JavaScript环境下的 模型-视图-控制器 (MVC) 框架.任何接触较大规模项目的开发人员一定会苦恼于各种琐碎的事件回调逻辑.以及金字塔般的代码.而且,在传统的 ...

  4. Android获取短信验证码

    Android开发中关于短息验证码的设计层出不穷,越来越多的应用为了更好的提高软件的安全性,开始使用通过服务器向用户发送验证码的方式,来保护用户个人信息的安全性.无论是用户注册时的信息验证还是当用户发 ...

  5. lintcode循环数组之连续子数组求和

    v 题目:连续子数组求和 II 给定一个整数循环数组(头尾相接),请找出一个连续的子数组,使得该子数组的和最大.输出答案时,请分别返回第一个数字和最后一个数字的值.如果多个答案,请返回其中任意一个. ...

  6. 从零开始编写自己的C#框架(6)——SubSonic3.0插件介绍(附源码)

    前面几章主要是概念性的东西为主,向初学者们介绍项目开始前的一些知识与内容,从本章开始将会进入实操阶段,希望跟着本系统学习的朋友认真按说明做好每一步操作(对于代码最好是直接照着文档内容在你的IDE中打一 ...

  7. 从一道面试题分析javascript闭包

    据说是一不注意就会做错的五道javascript面试题之一,我们来看看这道题长什么样 function Container( properties ) { var objthis = this; fo ...

  8. 如何搭建Percona XtraDB Cluster集群

    一.环境准备 主机IP                     主机名               操作系统版本     PXC 192.168.244.146     node1           ...

  9. php后管理分类导航菜单

    <!DOCTYPE> <html> <head> <meta http-equiv="Content-type" content=&quo ...

  10. 不行,受不了了,我要记录下这个 bug

    我们在使用 java 中使用线程 Thread 的时候,在 run(){  } 里面的如果要传递参数给函数,一般,编译系统都会提示我们,要将这个参数尽可能地设置为 final,即常量,一旦定义就不能再 ...