jquery.timepicker.js

客户提了个需求,输入日期,想也不用想,立刻翻查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。

原文地址:https://www.cnblogs.com/chenkuang/p/8136431.html