客户提了个需求,输入日期,想也不用想,立刻翻查Jquery,发现是有timepicker.js这个控件,马上就用。
1. 导入库
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> <script src="../../js/jquery.timepicker.min.js" type="text/javascript" ></script>
2. HTML
<input type="text" class="datePicker" name="section1_date" placeholder="">
3. JS
<script> $( function() { $(".datePicker").datepicker(); $(".datepicker").datepicker( "option", "dateFormat", "yy-mm-dd" ); $(".timePicker").timepicker(); $(".timePicker").timepicker({ \'timeFormat\': \'H:i\' }); } ); </script>
4. 定义格式
\'yy-mm-dd\' = 2017-12-07
\'H:i\' = 14:00
还有很多可以修改的东西,我只是看了一点官方的API,有机会再修改个好看的UI。