mui碰到的问题————日期控件

来源:互联网 发布:门户网站整站源码 php 编辑:程序博客网 时间:2024/05/17 21:58

前端页面加载js,css文件

css:<link rel="stylesheet" type="text/css" href="<%=basePath%>hd/page/mui/css/mui.picker.min.css" />

js:<script src="<%=basePath%>hd/page/mui/js/mui.picker.min.js"></script>


<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 optionsJson = this.getAttribute('data-options') || '{}';
                            var options = JSON.parse(optionsJson);
                            var id = this.getAttribute('id');
                            /*
                             * 首次显示时实例化组件
                             * 示例为了简洁,将 options 放在了按钮的 dom 上
                             * 也可以直接通过代码声明 optinos 用于实例化 DtPicker
                             */

//用来控制显示的问题如:只能选择当前年或者从当前时间之后选取

                            options.beginYear=nowDate.getFullYear();//设置查询当前年
                            options.endYear=nowDate.getFullYear();//设置查询当前年

                            //options.beginDay=now.getDate();

      //options.beginHours=now.getHours()+1;                         

                            _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>

原创粉丝点击