使用mui项目模板，用APP视角预览，此项目须在真机上进行运行测试。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> 6 <title></title> 7 <script src="js/mui.min.js"></script> 8 <link href="css/mui.min.css" rel="stylesheet"/> 9 <script type="text/javascript" charset="utf-8"> 10 mui.init(); 11 </script> 12 </head> 13 <body> 14 <header class="mui-bar mui-bar-nav"> 15 <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> 16 <h1 class="mui-title">时钟效果</h1> 17 </header> 18 <div class="mui-content"> 19 <div style="padding: 20px;"> 20 <button type="button" onclick="showDate();">获取日期</button> 21 <button type="button" onclick="showTime();">获取时间 </button> 22 </div> 23 </div> 24 </body> 25 <script type="text/javascript"> 26 function showDate(){ 27 var dDate = new Date(); 28 dDate.setFullYear(2018,3,8); 29 var minDate = new Date(); 30 minDate.setFullYear(2010,1,1); 31 var maxDate = new Date(); 32 maxDate.setFullYear(2020,12,31); 33 34 plus.nativeUI.pickDate( 35 function(e){ 36 var d = e.date; 37 mui.toast('您选择的日期是：'+d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate()); 38 }, 39 function(e){ 40 mui.toast('您没有选择'); 41 }, 42 { 43 title:'请选择日期', 44 date:dDate, 45 minDate:minDate, 46 maxDate:maxDate 47 } 48 ); 49 } 50 function showTime(){ 51 var myDate = new Date(); 52 var h = myDate.getHours(); 53 var min = myDate.getMinutes(); 54 var dTime = new Date(); 55 dTime.setHours(h,min); 56 57 plus.nativeUI.pickTime(function(e){ 58 var d = e.date; 59 mui.toast("您选择的时间是："+d.getHours()+":"+d.getMinutes()); 60 },function(e){ 61 mui.toast("您没有选择时间"); 62 },{ 63 title:"请选择时间", 64 is24Hour:true, 65 time:dTime 66 }); 67 } 68 </script> 69 </html>