基于Bootstrup的jQuery日期时间选择器

bootstrap-datetimepicker是一款基于Bootstrup 3的超实用jQuery日期时间选择器。通过该插件你可以非常容易的创建很酷的bootstrup样式的日期时间选择器

你也可以通过修改css文件来自定义它的样式。

该jQuery日期时间选择器的最小外部依赖需求是:

  • jQuery
  • Moment.js
  • Bootstrap.js(如果你不想使用完整的bootstrup,至少需要transition 和collapse)
  • Bootstrap Datepicker script
  • Bootstrap CSS
  • Bootstrap Datepicker CSS
  • Moment.js文件可以在这里下载。(关于Moment请看这篇文章)

在线演示:http://www.htmleaf.com/Demo/201503041459.html

下载地址:http://www.htmleaf.com/jQuery/Calendar-Date-Time-picker/201503041458.html

时间: 2024-12-24 09:59:07

基于Bootstrup的jQuery日期时间选择器的相关文章

日期时间选择器插件flatpickr

前言:在网页上需要输入时间的时候,我们可以用HTML5的inputl中的date类型.但是如下入所示,有些浏览器不支持.flatpickr这个小插件可以解决这个问题. 1.flatpickr日期时间选择器插件的github地址为:https://chmln.github.io/flatpickr/. 2.里面有很多例子,告诉我们呢怎么设置,不过太多很容易让人眼花.我这里做一个最简单的例子. 2.1引用人家的css和js //路径一定要写对 <link rel="stylesheet&quo

基于bootstrup的jQuery多功能模态对话框

这是一款非常实用的基于bootstrup的jQuery多功能模态对话框插件.该jQuery模态对话框集警告框.确认框和对话框于一体.是一款不可多得的多功能.多用途的模态对话框插件. 它的主要特点有: 可以通过AJAX直接将调用内容到对话框中. 可以在指定的时间后自动关闭对话框. 可以设置为点击模态背景不关闭对话框. 拥有丰富的回调函数. 在线演示:http://www.htmleaf.com/Demo/201502141378.html 下载地址:http://www.htmleaf.com/j

JS日期时间选择器

本文介绍一种日期和时间选择器的用法.此选择器由jqueryUI实现,支持精确到毫秒的时间选择. 此选择器项目地址为http://trentrichardson.com/examples/timepicker/ Demo地址为:http://www.helloweba.com/demo/timepicker/ 下载地址:http://download.csdn.net/detail/yanwushu/7721933 效果图 另外关于js时间选择器还可以参考其他项目 http://www.bootc

开发路程(11): 日期时间选择器datetimepicker

在做项目中,往往会遇到需要用户输入2014-07-19 09:55:53这样的格式的数据.就是典型的年月日时分秒这样的格式.这个时候,使用datetimepicker会比较简单. DateTimePicket jQuery 插件:使用此插件非强制性地将 datetimepicker. datepicker 或 timepicker 下拉列表添加到您的窗体.就是这样.很好看吧. 添加jquery.datetimepicker和datetimepicker.css到您的页面: 1 <link rel

纯js可定制的跨浏览器日期时间选择器插件

Rome是一款纯js可定制的跨浏览器日期时间选择器插件.该日期时间选择器不依赖于jQuery,但它依赖于moment.js.可以通过CSS文件来自定义该日期时间选择器的外观样式. 如果你想了解moment的国际化的信息,可以查看这里.你还可以点击这里查看moment的使用方法. 在线演示:http://www.htmleaf.com/Demo/201503091491.html 下载地址:http://www.htmleaf.com/jQuery/Calendar-Date-Time-picke

flatpickr功能强大的日期时间选择器插件

flatpickr日期时间选择器支持移动手机,提供多种内置的主题效果,并且提供对中文的支持.它的特点还有: 使用SVG作为界面的图标. 兼容jQuery. 支持对各种日期格式的解析. 轻量级,高性能,压缩后的版本仅6K大小. 对手机原生日期格式的支持. 下图说明了使用jQuery UI.Bootstrap.packadate.js和flatpickr拉齐制作一个日期时间选择器时,所需要的文件尺寸大小: 下图是flatpickr日期时间选择器的各种主题效果: 配置参数 在配置参数中,所有的类型为s

日期时间选择器:datetimepicker

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>演示:日期时间选择器:datetimepicker</title> <link rel="stylesheet" type="text/css" href="css/main.css" /> <link rel=&quo

Android中实现日期时间选择器(DatePicker和TimePicker)

利用Android应用框架提供的DatePicker(日期选择器)和TimePicker(时间选择器),实现日期时间选择器. Dialog的Content布局文件(date_time_dialog.xml): <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

Android日期时间选择器实现以及自定义大小

本文主要讲两个内容:1.如何将DatePicker和TimePicker放在一个dialog里面:2.改变他们的宽度: 问题1:其实现思路就是自定义一个Dialog,然后往里面同时放入DatePicker和TimePicker,直接贴代码: date_time_picker.xml: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://s