`
zkh43javaeye
  • 浏览: 84537 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

jQuery插件Datepicker日期选择器实现Javascript自定义日期格式选择功能

    博客分类:
  • js
阅读更多

原址:http://www.itstrike.cn/Home/Article/jQuery-date-picker-plugins-to-achieve-Datepicker-custom-Javascript-Date-Time-Selection

 

使用说明
需要使用jQuery库文件 (目前版本1.3)和jQuery Datepicker库文件 (目前版本3.5.1)
同时安装jquery.datepick-zh-CN.js支持中文语言包

素材准备
自定义日期选择器CSS样式,控制jQuery插件Datepicker日期选择器显示样式效果,如:datePicker.css

实例代码
一,包含文件部分

  1. <script type="text/javascript" src="jquery.js "></script>
  2. <script type="text/javascript" src="jquery.datepick.js "></script>
  3. <script type="text/javascript" src="jquery.datepick-zh-CN.js "></script>

二,HTML部分

  1. <div>jQuery插件datePicker日期选择器 [必优博客] </div>
  2. <input type="text" name="time" value="2009-2-9" id="biuuu " />

三,Javascript部分 (调用jQuery插件Datepicker日期选择器)

  1. <script type="text/javascript">
  2. <!--
  3. $(document).ready(function(){
  4. $('#biuuu ').datepick ({dateFormat : 'yy-mm-dd '});
  5. });
  6. //-->
  7. </script>

dateFormat 表示自定义设置日期格式,如:yy-mm-dd
实例可知使用jQuery插件Datepicker日期选择器实现Javascript自定义日期时间选择功能非常简单,一行代码即可实现,如果需要定制 Datepicker日期选择器,可配置jQuery插件Datepicker日期选择器的参数this.regional[''] = {}部分,部分参数如下:
monthNames 表示月份名称,默认英文,如:January
monthNamesShort 表示月份简称,默认英文,如:Jan
dateFormat 表示日期格式,如:yy-mm-dd
firstDay 表示星期的第一天,默认为星期天0
以及控钮设置等,具体可查看jQuery Datepicker的JS库文件,了解Datepicker的配置参数。

jQuery插件Datepicker日期选择器用户使用比较多,主要是由于其功能强大,显示效果美观,调用方便,实现Javascript自定义日期时间选择功能,值得推荐。

分享到:
评论

相关推荐

    jquery双日期选择器

    主要用于实现Javascript自定义日期时间选择的功能,以提高用户体验。 Javascript的日期选择器工具很多,jQuery插件Datepicker日期选择器功能强大,同时可自定义日期时间配置,调用非常方 便

    jQuery时间选择器datepicker年月日时分秒选择

    datepicker时间插件,多种选择方式,年月日,时分秒,区间范围,单个以及多个选择

    JQuery插件汇总

    Datepicker日期选择器实现Javascript自定义日期格式选择功能 SmoothNavigationalMenu导航菜单实现Javascript下拉多级菜单功能 ImageFlyout弹出图片实现javascript放大图片功能 accordion折叠菜单实现Javascript...

    jQuery日期选择器插件jQueryDatePicker

    jQueryDatePicker是一款基于moment.js的jQuery日期选择器插件。该日期选择器插件使用moment.js来解析,校验和格式化日期时间.

    jquery日期选择器

    jquery 日期选择器 将js放到需要引用插件的相同目录下,在需要引用的页面导入index.jsp上的js引用代码,需要引用日期选择插件的文本框的class=“datepicker”,引入index.jsp上的对应javascript代码,日期选择就做好...

    jquery-mobile-datepicker:用于日期月份选择器的 JQueryMobile 插件

    此版本的日期选择器已使用JQuery Mobile v1.4.2和JQuery v1.10.2进行测试 现场演示 查看 JSFiddle 中的现场演示:[单击此处]( ) 如何使用? 假设这些是您的输入:``` // 日期选择器// 月份选择器 To call jquery-...

    jquery-daterange-picker:一个建立在 jQuery UI Datepicker 之上的日期范围插件

    一个建立在 jQuery UI Datepicker 之上的日期范围插件,灵感来自 Google Analytics 日期范围功能。 该插件旨在为支持历史日期范围报告选项的应用程序提供日期选择器解决方案。 依赖项: jQuery 用户界面 时刻.js ...

    JQuery权威指南源代码

    使用jQuery选择器实现隔行变色 JavaScript代码检测页面元素 jQuery代码检测页面元素 使用jQuery基本选择器 使用jQuery层次选择器 使用jQuery基本过滤选择器 使用jQuery内容过滤选择器 使用jQuery可见性过滤...

    wave-datepicker:使用 Wave Float 样式的日期选择器

    使用 Bootstrap 样式的 jQuery 日期选择器小部件。 支持选择器左侧的快捷方式。 入门 依赖项: (1.7+) (2.0+) 包括在网站上: 您可以使用dist/wave-datepicker.js或缩小版本dist/wave-datepicker.min.js 。 ...

    Nepali-Multi-Date-Picker:尼泊尔语jQuery多日期选择器。 支持单日期选择和多日期选择

    一个基于尼泊尔日历的简单但功能强大的日期选择器。 支持单日期选择和多日期选择。 可以与表单输入内联使用。 可以通过按Shift或Control / Command键来选择多个日期。 演示 在检查工作演示 入门 正在安装 包括这些...

    pwt.datepicker:Javascript Jaalali Calendar支持日期选择器小部件

    波斯日期选择器 此日期选择器与伊朗日历一起使用。 贾拉利日历日期选择器,具体取决于 更多信息 注意:从1.0.0版起persianDatepicker支持公历 表中的内容: 选项 查看选项全文 CDN 未压缩的persian-date.js | ...

    datetimepicker:jQuery插件日期和时间选择器

    jQuery插件日期和时间选择器 DateTimePicker 日期选择器 时间选择器 突出显示单个日期或期间的选项 JS Build帮助 需要Node和NPM 安装: 安装bower全球与npm install -g bower 。 运行npm install 。 npm将查看...

    jquery-ui包含功能演示及代码

     jQuery UI实际上是jQuery插件,专指由jQuery官方维护的UI方向的插件 jQuery UI 与 jquery 的主要区别是: (1) jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。 (2) jQuery UI则是在jQuery的...

    jquery-datepicker:只是一个日期选择器

    日期选择器只是一个日期选择器。

    datepicker::warning:[不建议使用]不再维护。 一个简单的jQuery datepicker插件

    日期选择器 一个简单的jQuery datepicker插件。 目录 特征 支持 支持 支持 支持内联模式 支持触摸(移动) 支持国际化 跨浏览器支持 主要的 dist/ ├── datepicker.css ├── datepicker.min.css (compressed) ...

    jQuery权威指南-源代码

    其次详细讲解了jQuery的各种选择器、jQuery操作DOM的方法、jQuery中的事件与应用、jQuery中的动画和特效、Ajax在jQuery中的应用,以及各种常用的jQuery插件的使用方法和技巧,所有这些知识点都配有完整的示例(包括...

    Rotary-Datepicker:jQuery Rotary Datepicker - 一个很棒的日历新功能

    旋转日期选择器 本作品已根据。 jQuery Rotary Datepicker - 一个很棒的日历新功能 即将推出的功能 使用鼠标滚轮快速选择 滚动每个径向以仅控制该径向 在中心滚动以一次控制所有径向 在支持的设备上使用拖动界面和...

    Bangla-Calendar:一个用于孟加拉语的 jQuery 日期选择器插件

    要使用此插件,您需要 jquery.min.js 和 jquery-ui.css 并且日期选择器设计将与 jquery datepicker 相同。 我们实际上使用了 jquery-ui.css 中的相同设计 结构: js jquery.min.js jquery_bangla_datepicker.js ...

    jQuery-Timepicker-Addon:将时间选择器添加到jQueryUI Datepicker

    jQuery Timepicker插件 ... 要使用此插件,您必须包含带有日期选择器(以及可选的滑块)的jQuery(1.6+)和jQuery UI。 包括位于dist目录或CDN中的timepicker-addon脚本和CSS: 现在将timepicker与$

    jquery-asDatepicker:一个显示日期选择器的 jquery 插件

    一个显示日期选择器的jQuery插件。 入门 下载或。 在您的网页中: &lt; script src =" jquery.js " &gt; &lt;/ script &gt; &lt; script src =" dist/jquery-asDatepicker.min.js " &gt; &lt;/ script &gt; &lt; ...

Global site tag (gtag.js) - Google Analytics