本文实例讲述了jquery日历插件datepicker用法。分享给大家供大家参考,具体如下:

我用过好几种日历插件,有的太花哨,有的太简单,有的浏览器不兼容等等,没有一个能让我感到满意的,后来同事给我推荐了jquery.datepick这个插件,我从官方网站下了一个,亲自做了一下,感觉相当的不错,逻辑和样式可以完全分开,并且非常的灵活,支持30个国家的语言,基本能满足我的要求。

这里给出本站下载地址:https://www.jb51.net/jiaoben/19622.html

解压jquery.datepick.package-3.5.2.zip,默认是英文的日历,里面有一个jquery.datepick-zh-CN.js,加上这个可以把英文的变以成中文的,演示地址:http://demo.jb51.net/js/2011/jQuery_calendar/index.html

示例代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery Datepicker</title>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.datepick.js"></script>
<script type="text/javascript" src="jquery.datepick-zh-CN.js"></script>
<script type="text/javascript">
$(function() {
var nowdays = new Date();
var dateConfig = {
 showOn: 'both',        //二个都显示
 buttonImage: 'calendar.gif', //加载图片
 buttonImageOnly: true,    //显示图片的地方有一个突出部分,这个就是隐藏那玩意的
 changeFirstDay: false,    //这个参数干什么的呢,星期一是日历的第一个,不可以改动的
 numberOfMonths: 2,      //显示二个月,默认一个月
 minDate: nowdays,       //显示最小时间是今天
 dateFormat: 'yy-mm-dd',    //日期格式
 yearRange: '-20: 20'     //前后20年,不过这根minDate是今天有冲突,自己去试吧。
};
 $('#goodplugin').datepick(dateConfig);
 $('#showdate').datepick(dateConfig);
});
</script>
<link type="text/css" href="smoothness.datepick.css" rel="stylesheet" />
</head>
<body>
<h1>jquery 日历插件举例</h1>
<br>
<a href="datepick1.html">样式1</a>
<br>
<a href="datepick2.html">样式2</a>
<br>
<a href="datepick3.html">样式3</a>
<br><br><br>
<div id="showdate"></div>
<br>
<br>
<div>左边直接显示,右边要点击<input type="text" id="goodplugin"/></div>
</body>
</html>

说明:datepick插件里面有好多参数要设置,这个要根据个人的需要了。具体请参考jquery的官方网址http://docs.jquery.com/UI/Datepicker#options

更多关于jQuery插件相关内容感兴趣的读者可查看本站专题:《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

jquery日历插件datepicker用法分析的更多相关文章

  1. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  2. ios – DatePicker包含Year

    我在我的应用程序中实现了dataPicker.但它只显示月,日,小时.我怎么能在日期选择器中添加年份.任何的想法?

  3. iOS 5 – 将UIDatePicker最小日期设置为“今天”

    我知道如何将UIDatePicker中的最大和最小日期设置为某个日期,我想知道是否可以这样做,所以最小日期始终是“今天”日期.在我的应用程序中,用户输入过去的日期是没有意义的,只是为了让他们添加一个今天或将来的日期.解决方法将最短日期设置为现在,将显示日期设置为2秒:在初始化Nib或在重新使用时为视图控制器设置数据时执行此操作.您也可以在viewWillAppear中执行此操作.额外积分:您可以添加一种IBAction方法,巧妙地鼓励用户不要选择错误的建议日期:

  4. ios – 在greift中将gregorian datepicker转换为波斯语日期选择器?

    解决方法您需要设置日历,而不是dateFormat:如果要更改语言,还必须设置语言环境属性:此外,正如问题注释所述,您正在使用NSDateFormatter,而不是代码中的UIDatePicker.幸运的是,答案仍然是正确的;UIDatePicker还有一个日历属性,您可以设置该属性来实现此目标.

  5. ios – 如果用户以编程方式命中UITextfield,如何显示UIDatePicker

    只有当用户UITextField被点击时,才想显示UIDatePicker.当选择日期时,它应该显示在相同的UITextField中.我想以编程方式实现UIDatePicker.我知道如何编写UITextField的代码.我甚至不知道如何调用UIDatePicker.有人可以帮我吗出生日期解决方法最简单的方法是实现datePicker如下:创建datePicker:然后将datePicker链接到textfieldinputView:最后,您可以在选择日期时捕获该操作,并将日期转换为字符串,以在textF

  6. 在IOS9中的Cordova应用程序使用JQuery / Javascript的window.history问题

    在两个测试用例中唯一改变的是Cordova.js.解决方法我看到这是几个星期前,但我会发布这个,以防其他人遇到它.听起来它可能与iOS9中的哈希更改生成的导航事件有关.如果是这样,可以将其添加到index.html以禁用哈希侦听:

  7. ios – 用UIDatePicker替换UITextField输入

    ,我有一个很大的例外–我不能让选择器消失!我尝试注册事件UIControlEventTouchUpOutside,但似乎这不是由选择器生成的.如何识别用户已完成选择日期?还有,有没有办法禁止用户直接输入UITextField?我想强迫他们使用选择器.我看到这篇文章“DisableblinkingcursorinUITextField?”,但还有另一种方式吗?

  8. iOS 5上的jQuery事件

    解决方法在Apple开发论坛上由一个人回答:我需要在将元素添加到DOM之后才绑定(),如下所示:

  9. 如何在iOS中使用DatePicker仅接受月份和年份

    我正在使用swift构建应用程序,在该应用程序中,有一个字段用于接受借记卡的到期日期以进行付款.如何在Swift中使用DatePicker只接受月份和年份.如果使用datepicker是不可能的,那么请建议任何其他方式.先感谢您.解决方法选择-1Objective-C的迅速Swift3另一种模式是>UIDatePickerModeTime,>UIDatePickerModeDate,>UIDate

  10. ios – 将UIDatePicker添加到UIAlertView

    我正在尝试将日期选择器添加到警报视图.我可以根据按钮点击将动画添加到屏幕上,我看到一个黑盒但没有日期选择器.这是我到目前为止所拥有的……

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部