日期插件rolldate.js的使用

下载地址：http://www.jq22.com/jquery-info19834

效果：

代码：

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <meta http-equiv="X-UA-Compatible" content="ie=edge" />

    <link rel="stylesheet" href="js/rolldate/rolldate.css" />

    <title>日期插件</title>

    <style>

    input{

        display: block;

        border-radius: 4px;

        outline: none;

        border: 1px solid #ccc;

        width: 200px;

        height: 30px;

        margin: 20px auto;

        padding-right: 10px;

        text-align: right;

    }

    </style>

  </head>

  <body>

    <input readonly type="text" id="date" placeholder="YY-MM-DD" />

    <script src="js/jquery-3.2.1.min.js"></script>

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

    <script>

      $(function() {

        new rolldate.Date({

          el: "#date",

          format: "YYYY-MM-DD",

          beginYear: 2000,

          endYear: 2100,

          theme: "blue",

          tapBefore: function(el) {

            console.log("插件开始触发");

          },

          moveEnd: function(el, iscroll) {

            console.log("滚动结束");

          },

          confirmBefore: function(el, date) {

            console.log("确定按钮触发");

          },

          confirmEnd: function(el, date) {

            console.log("插件运行结束");

          }

        });

      });

    </script>

  </body>

</html>

日期插件rolldate.js的使用的更多相关文章

  1. 使用日期插件用js处理日期格式

    function compareDate(checkStartDate, checkEndDate) {    var arys1= new Array();    var arys2= new Ar ...

  2. 求大神帮解答calendar日期插件的问题

    小颖最近公司的项目里用了一款日期插件  calendar.js  但是在用的过程中遇到了难题,就是当日期只需要选择具体的月份就可以了,不需要再选具体日期时,小颖解决不了,只能让它默认显示出月份,但是月 ...

  3. 基于JS功能强大的日期插件Kalendae

    开发中需要一个日期插件,可以在zepto下使用,可以选择日期段,可以设置不可选日期 找到一个完全满足的,并且基于JS不依赖于任何库. 在线演示:http://chipersoft.com/Kalend ...

  4. [js插件]JqueryUI日期插件

    引言 之前使用jqueryUi中的弹出框做了一个可拖拽的弹出登录框,也顺便将里面的常用的日期插件和文本框智能提示插件,也学习了一下. 使用方法 首先在项目中引入以下文件: <!-- 日期插件 默 ...

  5. js日期插件bootstrap-datetimepicker的使用

    js日期插件——bootstrap-datetimepicker的使用心得: 在大多说的web项目中,都有日期选择器的使用.如果自己写一个日期选择器的话,费时又费力,而且不一定能写出来_(:3 」∠) ...

  6. 原生JS+CSS实现日期插件

    笔者最近在学习Element UI,觉得它提供的日期选择器既简单又美观,于是仿照着写了一个日期插件.笔者使用到的技术有ES5.CSS和HTML,控件兼容IE10+和谷歌浏览器.有一点需要注意,笔者使用 ...

  7. 轻量级的日期插件--datebox

    jquery的日期插件有好几款,H5中的input也可以自带日期选择.但为什么要再写一个,有两个理由,一个是引用的文件太大,而有时候只需要很简单的功能,二个是想加一些自定义的效果不好改. 我写的这个功 ...

  8. My97DatePicker日期插件

    My97DatePicker是一款优秀的日期插件,它可以很方便地实现各种日期选择效果,博得广大IT开发人员的青睐. 下面来讲讲它的常用功能及设置方法. 方法/步骤   先来最简单的配置方法: (1)下 ...

  9. jsp日期插件My97DatePicker

    jsp日期插件My97DatePicker 强大的日期控件 使用方便简单 (2010-10-30 18:59:12) 转载▼ 标签: js javascript 日期插件 jsp it 分类: jqu ...

随机推荐

  1. linux整个日志目录查询记录

    在linux下面需要查看整个目录的日志,搜索用户的一个行为.因为不知道具体是那一天,一个个的查询也可以,但是太麻烦.可以用过下面的命令来实现: rep -iRl  "关键字" ./ ...

  2. zabbix共享内存报错cannot create semaphore set

    zabbix共享内存报错 cannot open log: cannot create semaphore set: [28] No space left on device 报错原因: kernel ...

  3. 13.用别名（alias）创建你自己的命令

    现在是时候,感受第一次编程经历了!我们将用 alias 命令创建我们自己的命令.但在 开始之前,我们需要展示一个命令行小技巧.可以把多个命令放在同一行上,命令之间 用”;”分开.它像这样工作: com ...

  4. c# 控制台定时程序

    using System; using System.Timers; namespace DaoChuCore2 { class Program { static void Main(string[] ...

  5. 常用sql commands以及mysql问题解决日志

    mysql workbench常用命令快捷键 ctrl+T ->创建新的sql query tab ctrl+shift+enter->执行当前的sql命令 https://dev.mys ...

  6. 创建基于 AFS 的 Docker 容器卷

    标准的 Docker 容器卷一般是位于 Docker 主机上的一个本地目录.在这样的配置下,容器必须依赖于一台特定的主机,因此使得容器的迁移和扩展变得困难.通过使用容器卷插件,能让容器访问独立于主机的 ...

  7. java笔记--代码实现汉诺塔移动过程和移动次数

    汉诺塔 有三根相邻的柱子,标号为A,B,C,A柱子上从下到上按金字塔状叠放着n个不同大小的圆盘,要把所有盘子一个一个移动到柱子B上,并且每次移动同一根柱子上都不能出现大盘子在小盘子上方. --如果朋友 ...

  8. django项目配置

    创建工程 本项目使用git管理项目代码,代码库放在gitee码云平台.(注意,公司中通常放在gitlab私有服务器中) 1. 在git平台创建工程 1) 创建私有项目库 2)克隆项目到本地 3)创建并 ...

  9. 运维监控---企业级Zabbix详解_【all】

    基础LNMP环境搭建 Linux 下LNMP环境搭建 下载Zabbix 链接:https://pan.baidu.com/s/1n36esVyYAKstwnFopbV2sg 密码:izll 创建zab ...

  10. Exchange Server 2007 多名称证书配置

    Exchange Server 2007上配置多名称证书,有两种方式,一种是通过Exchange Management Shell利用命令行工具进行创建:另一种是通过证书管理器控制台进行创建.本文将介 ...