背景

Jquery Mobile官方的日期选择器在它的文档中还处于实验阶段，而且也没有看到官方的论坛上有什么人在用。于是有人开发了日期选择框。我搜索后找到了两个结果一个是Todd M. Horst编写的日期选择器，另一个是jQuery-Mobile-DateBox在前者的基础上开发出来的。后者看着样子不错，有两个样式，一个是Android版的，一个是日历版的样式，可就是实际用起来不是很给力。我在Jquery Mobile中文社区发了篇文章《jquery mobile时间选择器和日期选择器》，很多朋友反映说后者根本不好用。我也试用了一下，发现在我的iPad上根本不能用。很自然，我的项目就采用了前者，后来发现也不是很如意。弹出层效果在iPad上，如果页面高度很高的情况下，弹出层仅覆盖页面的上半部分选择框在这部分的中间，并不是像在pc上一样，弹出在页面的当前位置上。于是我便有了修改弹出层效果的想法。

简介

jQuery Mobile日期选择器插件汉化整理版，对Todd M. Horst编写的日期选择器做了汉化和进一步封装。

使用方法

1、引入css样式文件和js文件(注：注意这里js的加载顺序)

<link href="./jquery.mobile.simpledialog.css" type="text/css"></link> <link href="./datepicker.css" type="text/css"/> <script type="text/javascript" src="./dFormat.js"></script> <script type="text/javascript" src="./datepicker.js"></script> <script type="text/javascript" src="./jquery.mobile.simpledialog.js"></script>

2、给页面添加必须的图层

<div><a href="#"></a></div>

3、为文本框绑定日期选择控件(注：dateId为文本框的id)

<script type="text/javascript"> $(document).ready(function () { (function(){$('#dateId').bind("tap", {curdatetext: "dateId"}, datepicker.handler);})(); }); </script> 示例

点击此处查看

下载

点击此处下载