编辑下面的代码:【加编码】
<html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 旋转器(Spinner) - 时间</title> <link rel="stylesheet" href="https://libs.baidu.com/jqueryui/1.10.4/css/jquery-ui.min.css"> <script src="https://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script src="http://jqueryui.com/resources/demos/external/jquery.mousewheel.js"></script> <script src="http://jqueryui.com/resources/demos/external/globalize.js"></script> <script src="http://jqueryui.com/resources/demos/external/globalize.culture.de-DE.js"></script> <script src="https://libs.baidu.com/jqueryui/1.10.4/jquery-ui.min.js"></script> <link rel="stylesheet" href="/demo/jqueryui/style.css"> <script> $.widget( "ui.timespinner", $.ui.spinner, { options: { // 秒 step: 60 * 1000, // 小时 page: 60 }, _parse: function( value ) { if ( typeof value === "string" ) { // 已经是一个时间戳 if ( Number( value ) == value ) { return Number( value ); } return +Globalize.parseDate( value ); } return value; }, _format: function( value ) { return Globalize.format( new Date(value), "t" ); } }); $(function() { $( "#spinner" ).timespinner(); $( "#culture" ).change(function() { var current = $( "#spinner" ).timespinner( "value" ); Globalize.culture( $(this).val() ); $( "#spinner" ).timespinner( "value", current ); }); }); </script> </head> <body> <p> <label for="spinner">时间旋转器:</label> <input id="spinner" name="spinner" value="08:30 PM"> </p> <p> <label for="culture">选择一种用于格式化的文化:</label> <select id="culture"> <option value="en-EN" selected>English</option> <option value="de-DE">German</option> </select> </p> </body> </html>
结果: 【此窗口】 帮助?
Try it Yourself - © 自强学堂