JQuery日期选择器插件之date-input

官方网站：http://jonathanleighton.com/projects/date-input/

下载地址：

http://github.com/jonleighton/date_input/raw/master/jquery.date_input.js

http://github.com/jonleighton/date_input/raw/master/date_input.css

中文支持：

[javascript] view
plaincopy

  1. jQuery.extend(DateInput.DEFAULT_OPTS, {  month_names: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],  short_month_names: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二"],  short_day_names: ["一", "二", "三", "四", "五", "六", "日"]});

说明：默认是日期格式很不好，可以根据需求修改。

全部代码如下：

[html] view
plaincopy

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. <title>日历</title>
  6. <script type="text/javascript" src="jquery-1.3.2.js"></script>
  7. <script type="text/javascript" src="jquery.date_input.js"></script>
  8. <link rel="stylesheet" href="date_input.css" type="text/css">
  9. <script>
  10. jQuery.extend(DateInput.DEFAULT_OPTS, {
  11. month_names: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
  12. short_month_names: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二"],
  13. short_day_names: ["一", "二", "三", "四", "五", "六", "日"],
  14. dateToString: function(date) {
  15. var month = (date.getMonth() + 1).toString();
  16. var dom = date.getDate().toString();
  17. if (month.length == 1) month = "0" + month;
  18. if (dom.length == 1) dom = "0" + dom;
  19. return date.getFullYear() + "-" + month + "-" + dom;
  20. }
  21. });
  22. $(function() {
  23. $(".biuuu1").date_input();
  24. $(".biuuu2").date_input();
  25. });
  26. </script>
  27. </head>
  28. <body>
  29. <input type="text" class="biuuu1" name="date"/>
  30. <input type="text" class="biuuu2" name="date"/>
  31. </body>
  32. </html>

示例图：

版权声明：本文为博主原创文章，未经博主允许不得转载。

JQuery日期选择器插件date-input的更多相关文章

  1. DCalendar增加月份选择功能--简单jQuery日期选择器插件改动

    做时间插件的时候,很多都会遇到要做选择月份的插件,但是DCalendar提供的api只支持日期选择,最近遇到这个问题,所以调整了一下源码,话不多说,先看效果吧 点击日期插件,出现上图,再点击月份就直接 ...

  2. 一款简洁大气的jquery日期日历插件

    本jquery插件名为manhuaDate,暂时只支持jquery 1.9.0以下版本,比如jquery-1.8.3.min.js 查看效果网址:http://keleyi.com/a/bjad/em ...

  3. 贴近用户体验的jQuery日期选择插件

    分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览   源码下载 var dateRange = new ...

  4. 使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效

    最近写页面时需要用到,日期选择器,网上搜索了一些插件,最后使用了flatpickr.js.我是从npm 上拉下的依赖  npm install flatpickr --save 随后在页面中引入css ...

  5. jQuery日期联动插件

    此版本为网上的日期联动插件修改版,加入了修改后事件 /* * jQuery Date Selector Plugin * 日期联动选择插件 * * Demo: $("#calendar&qu ...

  6. Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定

    一放假就高产似母猪了. 00.混乱的前端界 Angular1.x确实是个学习成本很高的框架,刚开始实习那会儿,前端啥也不懂,工头说用Angular,我们这群小弟也只能硬着头皮学.在这之前,前端的东西大 ...

  7. jQuery的maskedinput插件 设置input掩码

    一.下载插件  http://digitalbush.com/projects/masked-input-plugin/二.属性a: 表示只能输入大小写字母9:表示只能输入0-9之间的数字*:a和9的 ...

  8. jQuery cxCalendar 日期选择器

    简介 cxCalendar 是基于 jQuery 的日期选择器插件. 它灵活自由,你可以自定义外观,日期的范围,返回的格式等. 版本: jQuery v1.7+ jQuery cxCalendar v ...

  9. 基于jQuery带备忘录功能的日期选择器

    今天给大家分享一款基于jQuery带备忘录功能的日期选择器.这款日期控制带有备记忘录功能.有备忘录的日期有一个圆圈,单击圆圈显示备忘录.该实例适用浏览器:360.FireFox.Chrome.Safa ...

随机推荐

  1. 织梦DEDE后台定时分时段自动更新发布文章插件

    定时审核插件使用说明 一.立信CPA培训注册会计师考试网站 以超级管理员身份登录后台,依次选择[核心]à [定时审核管理],输入定时审核的时间段,如下图所示: 功能说明: 1. 可以设置若干时间段,在 ...

  2. SpringBoot快速HelloWorld入门

    1.新建maven项目 2.pom.xml 里添加SpringBoot所依赖的jar包 <parent> <groupId>org.springframework.boot&l ...

  3. MYSQL进阶学习笔记十一：MySQL 表的分析，检查和优化！（视频序号：进阶_28)

    知识点十二:MySQL 表的分析,检查和优化(28) 表的分析,检查和优化: 定期分析表: ANALYZE [LOCAL | NO_WRITE_TO_BINLOG] TABLE tbl_name [, ...

  4. fullcalendar小结

    最近做的项目需要一个日程插件,在网上找了一些插件觉的fullcalendar 比较好用,总结一下以备后用. 效果图如下: var calendar = null; function ShowCalen ...

  5. hadoop-3.0.0 配置中的 yarn.nodemanager.aux-services 项

    在hadoop-3.0.0-alpha4 的配置中,yarn.nodemanager.aux-services项的默认值是“mapreduce.shuffle”,但如果在hadoop-2.2 中继续使 ...

  6. php连接数据库步骤

    第一步:连接数据库 $link=@mysql_connect('localhost','root','root') or die('数据库连接失败!'); echo '连接成功!'; 这里数据库连接函 ...

  7. 【转】Darwin Streaming Server 核心代码分析

    无意中看到了dqzhangp的一篇博客,分析了DSS的核心架构,读完顿时感觉豁然开朗,茅塞顿开,写得非常的鞭辟入里,言简意赅,我想没有相当的功力是写不出这样的文章的,情不自禁转到自己空间来,生怕弄丢了 ...

  8. Java的四大基础特性

    Java的四大基础特性 一.抽象 父类为子类提供一些属性和行为,子类根据业务需求实现具体的行为. 抽象类使用abstract进行修饰,子类要实现所有的父类抽象方法否则子类也是抽象类. 二.封装 把对象 ...

  9. javascript的回调函数

    函数也是对象 想弄明白回调函数,首先的清楚地明白函数的规则.在javascript中,函数是比较奇怪的,但它确确实实是对象.确切地说,函数是用Function()构造函数创建的Function对象.F ...

  10. ASP.NET Core MVC 打造一个简单的图书馆管理系统 (修正版)（六）学生借阅/预约/查询书籍事务

    前言: 本系列文章主要为我之前所学知识的一次微小的实践,以我学校图书馆管理系统为雏形所作. 本系列文章主要参考资料: 微软文档:https://docs.microsoft.com/zh-cn/asp ...