码迷,mamicode.com
首页 > 移动开发 > 详细

移动端web日期与时钟设置

时间:2018-03-09 00:28:22      阅读:349      评论:0      收藏:0      [点我收藏+]

标签:style   20px   color   add   link   ref   src   div   eth   

使用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>

 

移动端web日期与时钟设置

标签:style   20px   color   add   link   ref   src   div   eth   

原文地址:https://www.cnblogs.com/a252336799/p/8531246.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!