MUIのpicker(日付セレクタ)設定後のendDateは現在の時刻です。
5940 ワード
MUI公式サイト:http://dev.dcloud.net.cn/mui/
<!-- mui.css-->
<link rel="stylesheet" href="../css/mui.min.css"/>
<!--App css-->
<link rel="stylesheet" type="text/css" href="../css/app.css"/>
<!--<link href="../css/mui.picker.css" rel="stylesheet" />
<link href="../css/mui.dtpicker.css" rel="stylesheet" />-->
<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>
</code></pre>
<pre><code> <header class="mui-bar mui-bar-nav">
<h1 class="mui-title">dtpicker( )</h1>
</header>
<div class="mui-content">
<div class="mui-content-padded">
<h5 class="mui-content-padded"> </h5>
<button id="demo4" data-options="{"type":"date"}" class="btn mui-btn mui-btn-block"> ...</button>
<div id="result" class="ui-alert"/>
</div>
</div>
</code></pre>
<pre><code> <script src="../js/mui.min.js"/>
<!--<script src="../js/mui.picker.js"></script>
<script src="../js/mui.dtpicker.js"></script>-->
<script src="../js/mui.picker.min.js"/>
<script>
(function($) {
$.init();
var result = $('#result')[0];
var btns = $('.btn');
btns.each(function(i, btn) {
btn.addEventListener('tap', function() {
var _self = this;
if(_self.picker) {
_self.picker.show(function (rs) {
result.innerText = ' : ' + rs.text;
_self.picker.dispose();
_self.picker = null;
});
} else {
var year=new Date().getFullYear() ;
var month=new Date().getMonth();
var day=new Date().getDate();
_self.picker = new mui.DtPicker({
type: "date",//
beginDate: new Date(2009, 12, 01),//
endDate: new Date(year, month, day),//
});
// var optionsJson = this.getAttribute('data-options') || '{}';
// var options = JSON.parse(optionsJson);
// var id = this.getAttribute('id');
/*
*
* , options dom
* optinos DtPicker
*/
// _self.picker = new $.DtPicker(options);
_self.picker.show(function(rs) {
/*
* rs.value value
* rs.text text
* rs.y , rs.y.vaue rs.y.text
* rs.m ,
* rs.d ,
* rs.h ,
* rs.i (minutes ),
*/
result.innerText = ' : ' + rs.text;
/*
* false
* return false;
*/
/*
* ,
* , ,new DtPicker(options) , 。
* , , , 。
* dispose , 。
*/
_self.picker.dispose();
_self.picker = null;
});
}
}, false);
});
})(mui);
</script>
</code></pre>
</article>
</div>
</div>