3 回答
TA贡献1806条经验 获得超8个赞
datepicker是一个配置灵活的插件,我们可以自己定义其展开方式,包括日期格式、语言、限制日期选择范围、添加相关按钮以及其他导航等。
具体步骤:
1.引入jquery.js;
2.引入ui下面的jquery.ui.core.js、jquery.ui.widget.js、jquery.ui.datepicker.js;
3.如果想设置日历为中文形式,需要引入ui->i18n下面的jquery.ui.datepicker-zh-CN.js;
4.在HTML中需为input type="text"设置ID;
5.写js代码,引入datepicker定义的函数以及各参数的设置。
6.可引入jQuery ui中相应的样式也可根据自己的需要修改样式。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | 如果需要显示时分秒: 1.需下载jquery-ui-timepicker-addon.js,并在页面加载; 2.页面添加样式 .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; } .ui-timepicker-div dl { text-align: left; } .ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; } .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; } .ui-timepicker-div td { font-size: 90%; } .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; } 3. $("#date").datetimepicker();//显示时分秒 $("#datetime").datepicker(); // 显示日期 $("#datetime").timepicker(); // 显示时分秒 ) |
TA贡献1828条经验 获得超3个赞
1 2 | $("body").delegate(".datacss", "focusin", function(){ $(this).datepicker();}); |
- 3 回答
- 0 关注
- 1010 浏览
添加回答
举报