在有些需求中是需要选择时间的而jquery ui的Datepicker是不能选择时间的,现在找一个扩展了的插件非常好用,在附件中,使用截图如下:
[img]http://dl.iteye.com/upload/attachment/282058/054f7d8b-175f-3e20-96a5-6ea810b786fa.jpg[/img]
[img]http://dl.iteye.com/upload/attachment/282060/2b600ee6-affb-3dab-a2e6-fe25f2eb86ee.jpg[/img]
1.在使用时需要导入的jquery ui js 文件
jquery.ui.datepicker.js
jquery.ui.slider.js
jquery-ui-timepicker-addon-0.5.js
以及一些ui的必须包。
2.在页面中加入Timepicker的css
使用示例如下:
[img]http://dl.iteye.com/upload/attachment/282058/054f7d8b-175f-3e20-96a5-6ea810b786fa.jpg[/img]
[img]http://dl.iteye.com/upload/attachment/282060/2b600ee6-affb-3dab-a2e6-fe25f2eb86ee.jpg[/img]
1.在使用时需要导入的jquery ui js 文件
jquery.ui.datepicker.js
jquery.ui.slider.js
jquery-ui-timepicker-addon-0.5.js
以及一些ui的必须包。
2.在页面中加入Timepicker的css
#ui-timepicker-div dl{ text-align: left; }
#ui-timepicker-div dl dt{ height: 25px; }
#ui-timepicker-div dl dd{ margin: -25px 0 10px 65px; }
使用示例如下:
$('#example2').datetimepicker({
ampm: false,//上午下午是否显示
timeFormat: 'hh:mm',//时间模式
stepHour: 1,//拖动时间时的间隔
stepMinute: 5,//拖动分钟时的间隔
dateFormat:"yy-mm-dd", //日期格式设定
showHour: true,//是否显示小时,默认是true
showMinute true//是否显示分钟,默认是true
});
<input type="text" name="example2" id="example2" value="" />