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>