在移动端网站或应用中,日期时间选择功能是非常常见的需求。为了方便用户选择日期时间,使用jquery移动端日期时间控件能够增强用户体验。下面就来介绍一下如何使用jquery移动端日期时间控件。
首先,需要在HTML文件中引入jquery以及datetimepicker所需的CSS和JS文件:
<link rel="stylesheet" href="jquery.datetimepicker.min.css"> <script src="jquery.min.js"></script> <script src="jquery.datetimepicker.full.min.js"></script>
然后,在需要添加日期时间选择功能的元素上添加类名或ID,如此处添加了ID为datepicker的类名:
<input type="text" id="datepicker">
$(function(){ $('#datepicker').datetimepicker({ format:'Y-m-d H:i',//设置时间格式 minDate:0,//设置最小日期为当天 lang:'zh',//设置语言为中文 step:10 //设置时间间隔为10分钟 }); });
在以上代码中,通过设置format属性,可以自定义时间格式,如"Y-m-d H:i:s"表示年-月-日 时:分:秒。minDate属性可以设置最小日期,lang属性设置语言为中文,step属性可以设置时间间隔。