mui的时间控件 picker
大家好，又见面了，我是你们的朋友全栈君。<!DOCTYPE html> <html>
<head> <meta charset=”utf-8″> <meta name=”viewport” content=”width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no” /> <title></title> <!–标准mui.css–> <link rel=”stylesheet” href=”../css/mui.min.css”> <!–App自定义的css–> <link rel=”stylesheet” type=”text/css” href=”../css/app.css” /> <link rel=”stylesheet” type=”text/css” href=”../css/mui.picker.min.css” /> <style> html, body, .mui-content { height: 0px; margin: 0px; background-color: #efeff4; } h5.mui-content-padded { margin-left: 3px; margin-top: 20px !important; } h5.mui-content-padded:first-child { margin-top: 12px !important; } .mui-btn { font-size: 16px; padding: 8px; margin: 3px; } .ui-alert { text-align: center; padding: 20px 10px; font-size: 16px; } * { -webkit-touch-callout: none; -webkit-user-select: none; } </style> </head>
<body> <div class=”mui-content”> <div class=”mui-content-padded”> <h5 class=”mui-content-padded”>常规示例</h5> <button id=’demo4′ class=”btn mui-btn mui-btn-block”>选择日期 …</button> <div id=’result’ class=”ui-alert”></div> </div> </div> <script src=”../js/mui.min.js”></script> <script src=”../js/mui.picker.min.js”></script> <script> document.getElementById(“demo4”).addEventListener(‘tap’, function() { var dtpicker = new mui.DtPicker({ //value:self.AuthorizationTime, type: “date”,//设置日历初始视图模式 //beginDate: new Date(self.AuthorizationTime),//设置开始日期 //endDate: new Date(self.nowDate.getFullYear(), self.nowDate.getMonth(), self.nowDate.getDate()),//设置结束日期 labels: [‘年’, ‘月’, ‘日’]//设置默认标签区域提示语 }//时间/日期别名 ) dtpicker.show(function(e) { document.getElementById(‘result’).html=e.text; //changedate(e.text); }) }); //可以转换格式017-01-01 转换成2017年1月1号 function changedate(result) { } </script> </body>
</html>
发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/142339.html原文链接：https://javaforall.cn