2***@qq.com
2***@qq.com
  • 发布:2017-10-10 15:00
  • 更新:2017-10-11 11:32
  • 阅读:6351

mui日期选择器怎么用啊,有没有完整的demo看一下

分类:MUI
mui
2017-10-10 15:00 负责人:无 分享
已邀请:
n***@gmail.com

n***@gmail.com

在hbuilder中新建移动app --> 选择模板 Hello mui,可看到示例代码

全敏

全敏 - qm

(function($) {  
    var GetDateInfo = $.getDateInfo = $.Class.extend({  
        init: function(element, fun) {  
            var self = this;  
            if(element.nodeType) {  
                self.ele = element;  
                fun && (self.fun = fun);  
                self.EventInit();  
            } else {  
                throw new Error('传入的参数不是Element类型!');  
            }  
            return self;  
        },  
        //绑定事件  
        EventInit: function() {  
            var self = this,  
                selfEle = this.ele,  
                isBindingEvent = selfEle.hasAttribute("data-getDate-event"); //是否绑定点击事件  
            !isBindingEvent && selfEle.addEventListener("tap", function() {  
                self.getDate()  
            }), selfEle.setAttribute("data-getDate-event", true); //绑定点击事件  
            !selfEle.hasAttribute("readonly") && selfEle.tagName == 'INPUT' && selfEle.setAttribute("readonly", "readonly"); //如果是INPUT添加禁用状态  
            return self;  
        },  

        /*为了不犯和官方numbox插件不能动态设置最大值和最小值的错误,本插件采用的都是实时获取attr的值*/  
        getDate: function() {  
            var self = this,  
                selfEle = self.ele,  
                attrDateType = self.dateType = selfEle.getAttribute("data-dateType") || "date";  
                attrDateType == "date" && self.setDate();  
                attrDateType == "time" && self.setTime();  
                attrDateType == "dateTime" && self.setDateTime();  
            return self;  
        },  
        setDate: function(fn) {  
            var self = this,  
                selfEle = self.ele,  
                attrDefaultDate = selfEle.getAttribute("data-defaultDate"), //获取attr设置的当前日期  
                dDate = new Date(), //当前日期对象  
                activeDate = [dDate.getFullYear(), dDate.getMonth(), dDate.getDate()], //获取当前日期  
                attrMinDate = selfEle.getAttribute("data-minDate"), //获取最小日期  
                attrMaxDate = selfEle.getAttribute("data-maxDate"), //获取最大日期  
                minDate, maxDate; //最大值、最大值对象  

            /*设置默认日期*/  
            attrDefaultDate ? dDate = self.setDateStr(attrDefaultDate) : dDate.setFullYear(activeDate[0], activeDate[1], activeDate[2]);  
            /*设置最小日期*/  
            attrMinDate && (minDate = attrMinDate=="active"?self.setDateObj(activeDate):self.setDateStr(attrMinDate));  
            /*设置最大日期*/  
            attrMaxDate && (maxDate = attrMaxDate=="active"?self.setDateObj(activeDate):self.setDateStr(attrMaxDate));  

            plus && plus.nativeUI.pickDate(function(e) {  
                var d = e.date,  
                    dStr = d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate();  

                if(self.dateType == 'dateTime'){  
                    fn && fn(dStr);  
                }else{  
                    selfEle.tagName == 'INPUT' && (selfEle.value = dStr);  
                    self.fun && self.fun(dStr,selfEle);  
                }  
            }, function(e) {  

            }, {  
                title: "请选择日期",  
                date: dDate,  
                minDate: minDate,  
                maxDate: maxDate  
            });  
        },  
        setTime: function(fn) {  
            var self = this,  
                selfEle = self.ele,  
                attrDefaultTime = selfEle.getAttribute("data-defaultTime")?selfEle.getAttribute("data-defaultTime").split(":"):null,  
                dTime = new Date();  

            attrDefaultTime?dTime.setHours(attrDefaultTime[0], attrDefaultTime[1]):dTime.setHours(12, 0);  
            plus.nativeUI.pickTime(function(e) {  
                var d = e.date,  
                    dStr = d.getHours() + ":" + d.getMinutes();  

                if(self.dateType == 'dateTime'){  
                    fn && fn(dStr);  
                }else{  
                    selfEle.tagName == 'INPUT' && (selfEle.value = dStr);  
                    self.fun && self.fun(dStr,selfEle);  
                }  
            }, function(e) {  

            }, {  
                title: "请选择时间",  
                is24Hour: true,  
                time: dTime  
            });  
            return self;  
        },  
        setDateTime:function(){  
            var self = this,  
                selfEle = self.ele,  
                returnDateStr = '';  
            self.setDate(function(str){  
                returnDateStr = str;  
                self.setTime(function(str){  
                    returnDateStr +=' '+str;  
                    selfEle.tagName == 'INPUT' && (selfEle.value = returnDateStr);  
                    self.fun && self.fun(returnDateStr);  
                });  
            })  
        },  
        setDateStr: function(str) {  
            if(typeof str === 'string') {  
                var returnAry = str.split("-").map(function(item, index) {  
                    if(index == 1) {  
                        return +item - 1;  
                    } else {  
                        return +item;  
                    }  
                });  
                var dateObj = new Date();  
                dateObj.setFullYear(returnAry[0], returnAry[1], returnAry[2]);  
                return dateObj;  
            } else {  
                throw new Error('传入的参数不是字符串类型!');  
            }  
        },  
        setDateObj: function(dateAry){  
            var d = new Date();  
                d.setFullYear(dateAry[0],dateAry[1],dateAry[2]);  
            return d;  
        }  
    });  

    $.fn.getDateInfo = function() {  
        this.each(function(i, item) {  
            if(item.GetDateInfo) {  
                return false;  
            } else {  
                item.getDateInfo = new GetDateInfo(item);  
                return true;  
            }  
        });  
    };  
})(mui);

该问题目前已经被锁定, 无法添加新回复