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. DP入门水题集

    HDU 1087 Input contains multiple test cases. Each test case is described in a line as follow:N value ...

  2. 更改redhat7 yum源为centos

    1. 替换原系统中yum包, 检查初始的yum包有哪些 rpm -qa |grep yum 2. 删除原始的yum包. rpm -qa|grep yum|xargs rpm -e --nodeps 3 ...

  3. [easyUI] 列表

    一. 简述: 对一个层级的ul/ol进行调用menu()函数,即可简单做成层叠列表. 二. 实例: <ul id="menu3"> <li>Menu1 &l ...

  4. Symbol Vs String

    最重要区别 1 symbol存入内存后,始终存在,如果不进行垃圾收集,可能导致内存泄漏. String只会存在于某个创建它的作用域内.即有生命周期的. 2.唯一性. \\进入控制台 >" ...

  5. 【C/C++】Rotate Array

    实现数组旋转(循环右移) 如数组 [1, 2, 3, 4, 5, 6, 7],右移 3 位则为 [5, 6, 7, 1, 2, 3, 4] 首先使用泛型函数 void Rotate(void *fro ...

  6. 添加浏览器back操作时的响应事件

    https://blog.csdn.net/xcqingfeng/article/details/70800118 $(function(){ pushHistory(); window.addEve ...

  7. 一天一点Zynq(1)xilinx-arm-linux交叉编译链 安装总结以及资源更新

    结束了对xilinx-arm-linux交叉编译链安装后,总结一下整个过程,方便后来的研究者们,少走点弯路. 关于xilinx-arm-linux交叉编译链的安装,网上一搜一大把,可是有的资料中的资源 ...

  8. 1.3 第一个Go程序

    1.3.1 Hello Go // hello.go package main import ( "fmt" ) func main() { fmt.Println("H ...

  9. SSH登录异常(someone is doing something nasty)

    在平时工作中,有时候需要SSH登陆到别的Linux主机上去,但有时候SSH登陆会被禁止,并弹出如下类似提示: @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ...

  10. Forth 内存布局

    body, table{font-family: 微软雅黑} table{border-collapse: collapse; border: solid gray; border-width: 2p ...