Jquery UI 的移动版日期拾取器插件 Jquery UI's Datepicker Styled for mobile
优质
小牛编辑
144浏览
2023-12-01
下面这个示例是Jquery UI 为移动设备开发的日期拾取器插件,这个插件并不包含在Jquery Mobile默认库当中,你需要自己手动include这些文件
日期拾取器 Datepicker
使用说明 Usage Instructions
日期拾取器自动从type="date"属性的输入框中生成
<label for="date">Date Input:</label>
<input type="date" name="date" id="date" value="" />
我们推荐将label和input包裹在data-role=fieldcontain的div中作为描述,而且这些元素应该添加form中以便在 C级浏览器也能够正常访问
注意:该插件并不包含在Jquery Mobile默认库当中,你需要包含以下文件来使用该插件:
<link rel="stylesheet" href="Jquery.ui.datepicker.mobile.css" />
<script src="Jquery.ui.datepicker.js"></script>
<script src="Jquery.ui.datepicker.mobile.js"></script>
你同样可能需要配置页面插件来使"date" input 转换为"text" input 以避免原生"date" input与我们自定义的datepicker所冲突,要实现这样的功能需要在"mobileinit"事件处理函数中使用如下代码:
<script>
//reset type=date inputs to text
$( document ).bind( "mobileinit", function(){
$.mobile.page.prototype.options.degradeInputs.date = true;
});
</script>
把这些代码放置在在Jquery加载后,Jquery Mobile加载前。你可以查看该页面的源代码是如何写的