客户提了个需求,输入日期,想也不用想,立刻翻查Jquery,发现是有timepicker.js这个控件,马上就用。

1. 导入库

<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="../../js/jquery.timepicker.min.js" type="text/javascript" ></script>

2. HTML

<input type="text" class="datePicker" name="section1_date" placeholder="">

3. JS

<script>
$( function() {
$(".datePicker").datepicker();
$(".datepicker").datepicker( "option", "dateFormat", "yy-mm-dd" ); $(".timePicker").timepicker();
$(".timePicker").timepicker({ 'timeFormat': 'H:i' });
} );
</script>

4. 定义格式

'yy-mm-dd' = 2017-12-07

'H:i' = 14:00

还有很多可以修改的东西,我只是看了一点官方的API,有机会再修改个好看的UI。

jquery.timepicker.js - 最常用的日期JS控件的更多相关文章

  1. jquery 带农历天干地支的日期选择控件

    效果图:

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

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

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

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

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

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

  5. jquery日期时间控件

    代码下载地址:  jquery日期时间控件下载地址 .  工作中用到, 这里分享一下, 避免重复摸索劳动. 一. HTML 文件    <!DOCTYPE HTML PUBLIC "- ...

  6. jquery mobiscroll移动端日期选择控件(无乱码)

    jquery mobiscroll移动端日期选择控件(无乱码) <pre><!DOCTYPE html><html lang="en">< ...

  7. ASP.NET开发中主要的字符验证方法-JS验证、正则表达式、验证控件、后台验证

    ASP.NET开发中主要的字符验证方法-JS验证.正则表达式.验证控件.后台验证 2012年03月19日 星期一 下午 8:53 在ASP.NET开发中主要的验证方法收藏 <1>使用JS验 ...

  8. JS调用Android、Ios原生控件

    在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时, ...

  9. 【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨

    原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...

随机推荐

  1. 【题解】Acting Cute

    题目简介 正在 rainbow 的城堡游玩的 Freda 恰好看见了在地毯上跳舞卖萌的水叮当--于是-- Freda:"呜咕>_< 我也要卖萌T_T!" rainbow ...

  2. ubuntu在虚拟机下的安装 ~~~ Hadoop的安装及配置 ~~~ Hdfs中eclipse的安装

     前言 Hadoop是基于Java语言开发的,具有很好跨平台的特性.Hadoop的所要求系统环境适用于Windows,Linux,Mac系统,我们推荐选择使用Linux或Mac系统.而Linux系统则 ...

  3. P4147 玉蟾宫(悬线法求最大子矩阵)

    P4147 玉蟾宫 悬线法 ,\(l_{i,j},r_{i,j},up_{i,j}\) 分别表示 \((i,j)\) 这个点向左,右,上能到达的远点.然后面积就很好办了.具体实现见代码. 然而,还有更 ...

  4. UVA - 12186 Another Crisis(工人的请愿书)(树形dp)

    题意:某公司有1个老板和n(n<=105)个员工组成树状结构,除了老板之外每个员工都有唯一的直属上司.老板的编号为0,员工编号为1~n.无下属的员工(叶子)打算签署一项请愿书递给老板,但不能跨级 ...

  5. POJ 1845:Sumdiv 快速幂+逆元

    Sumdiv Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 16466   Accepted: 4101 Descripti ...

  6. mysql数据库索引优化

    参考 :http://www.cnblogs.com/yangmei123/archive/2016/04/10/5375723.html MySQL数据库的优化:    数据库优化的目的:     ...

  7. Python Email发送,通知业务完成

    Email 发送 #!/usr/bin/python # -*- coding: UTF-8 -*- import base64 import smtplib from email.mime.text ...

  8. [GXYCTF2019]BabySQli

    0x00 知识点 emmm这道题目就是脑洞得大,能猜后端源码 0x01 解题 查看源码: base32,base64解码得到 select * from user where username = ' ...

  9. JAVA课程设计——俄罗斯方块(团队)

    1.团队介绍 1.1 团名:终于可以回家了嗷嗷嗷 1.2 团员介绍 2.参考来源 https://www.jb51.net/article/142716.htm 3.项目git地址 https://g ...

  10. 为什么声明了int型的变量并且直接初始化后,int型变量的地址一直在变化?

    /************************************************************************* > File Name: ptr_varia ...