github地址: https://github.com/yuanzm/simple-date-picker#simple-date-picker

simple-date-picker

基于zepto的移动端轻量级日期插件

安装

支持下面两种方式

  • git clone之后直接拷贝引用bin文件夹下面的datepicker.min.cssdatepicker.min.js
  • 从npm下载安装:npm install --save date_picker

使用

  • 引用样式datepicker.min.css
  • 引用datepicker.min.js或者引用模块var DatePicker = require('date_picker');
  • 实例化组件,绑定插件日期选择完成之后的回调函数
var _date = document.getElementById('date');

	var datePicker = new DatePicker({
confirmCbk: function(data) {
_date.value = data.year + '-' + data.month + '-' + data.day;
}
}); _date.onfocus = function(e) {
_date.blur();
datePicker.open();
};

插件外置两个API: openclose,其中特别注意上面demo中_date在获取焦点之后里面强制去除了焦点,是为了避免安卓下面为input标签设置readonly属性并不能禁止原生键盘弹出的问题。

在线demo

参考:https://www.cnblogs.com/yuanzm/p/5241323.html

Web APP 日期选择控件的更多相关文章

  1. 用c/c++混合编程方式为ios/android实现一个自绘日期选择控件(一)

    本文为原创,如有转载,请注明出处:http://www.cnblogs.com/jackybu 前言 章节: 1.需求描述以及c/c++实现日期和月历的基本操作 2.ios实现自绘日期选择控件 3.a ...

  2. js 跨域的问题 (同一个主域名不同的二级域名下的跨域问题) 解决 WdatePicker.js my97日期选择控件

    例如域名是  a.xx.com  和 b.xx.com    如果一个页面中引入多个iframe,要想能够操作所有iframe,必须都得设置相同domain. 如果iframe的时候  a包含b  为 ...

  3. JQuery好用的日期选择控件 DatePicker

    近期发现一个很好的基于JQ的前端UI日期选择控件Jquery.DatePicker.js 下载地址:jquery.DatePIcker.js 演示地址:DatePicker - 基于jQuery 1. ...

  4. [Ext JS 4] 实战之 带week(星期)的日期选择控件(三)

    前言 在 [Ext JS 4] 实战之 带week(星期)的日期选择控件(二) 的最后,有提到一个解决方案. 不过这方案有一个条件  ==> “2. 每年的周数从(1-52), 如果超过52 周 ...

  5. Swift - 日期选择控件(UIDatePicker)的用法

    1,使用storyboard创建日期选择控件 首先我们将一个UIDatePicker控件和一个按钮直接添加到Main.Storyboard上.该按钮是为了点击时弹出提示框显示当前选择的日期和时间. 同 ...

  6. Android自定义View(RollWeekView-炫酷的星期日期选择控件)

    转载请标明出处: http://blog.csdn.net/xmxkf/article/details/53420889 本文出自:[openXu的博客] 目录: 1分析 2定义控件布局 3定义Cus ...

  7. 取消layUI中日期选择控件默认填充日期

    input标签中使用日期选择控件填写,加载时默认填充当前日期, 标签设置了placeholder="请选择" autocomplete="off",但是并没有效 ...

  8. Ionic实战六:日期选择控件

    onic日期选择控件,用于ionic项目开发中的日期选择以及日期插件   

  9. ASP.NET(c#) 日期选择控件的另一种实现方法

    这篇文章是在一个英文网站发现的,完全使用ASP.NET实现了日期选择的基本功能,没有使用js,原文链接http://geekswithblogs.net/plundberg/archive/2009/ ...

随机推荐

  1. 『Python』源码解析_从ctype模块理解对象

    1.对象的引用计数 从c代码分析可知,python所有对象的内存有着同样的起始结构:引用计数+类型信息,实际上这些信息在python本体重也是可以透过包来一窥一二的, from ctypes impo ...

  2. Nginx的使用(一)Nginx+IIS实现一个网站绑定多个https域名

    使用nginx最初的目的是为了解决iis7下无法配置多个443端口的问题,iis7下不同的域名无法同时绑定443端口,据说iis8是可以的,但是iis8的话需要安装windows server2012 ...

  3. Win10系列:C#应用控件基础9

    TextBox控件 在前文中已经或多或少的接触到过TextBox控件.TextBox控件是一种常用的,也是比较容易掌握的文本编辑控件,它不仅可以接收输入的数据,还可以像TextBlock控件(Text ...

  4. Spring Boot + Jpa + Thymeleaf 增删改查示例

    快速上手 配置文件 pom 包配置 pom 包里面添加 Jpa 和 Thymeleaf 的相关包引用 <dependency> <groupId>org.springframe ...

  5. RN环境的搭建

    RN技术详细了解: RN环境的搭建: 1.           首先安装node.js 2.           安装homebrew(网上内容很多自己找,详细的我就不多说了) (1)   在home ...

  6. ES6和ES5变量声明的区别(var let const)

    // es5的语法与es6的语法区别 // var let const console.log(name);//undefine,不会报错,因为变量声明会提到作用域的最前面 var name=&quo ...

  7. return 返回值的用法

    #coding:utf-8 # (1)把数据返回到函数调用处 def func(): # return 1 # return "aaabb" return [1,2,3,4] re ...

  8. oracle 11g安装过程

    1,工具:Oracle_win64_11gR2_database(64位oracle 11g数据库).iso安装文件,win10系统 2,右键,解压后,点击setup.exe,系统会检测本机的环境,如 ...

  9. Oracle创建表空间报错:O/S-Error: (OS 3) 系统找不到指定的路径

    创建sql:         CREATE TABLESPACE TBSP_1 DATAFILE 'E:/oracle/product/10.2.0/tablespaces/weblogic.dbf' ...

  10. 周强 201771010141 《面向对象程序设计(java)》 第二周学习总结

    第一部分:理论知识学习部分 第三章 java的基本程序设计结构 本章主要学习数据类型.变量.运算符.类型转换.字符串.输入输出.控制流程.大数值.数组等内容. 1.基本知识 (1)标识符:由字母.下划 ...