HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

如何授权应用(设置协作者)

协作者 流应用 开发者中心 授权应用

> 文档已迁移至新链接:https://uniapp.dcloud.net.cn/dev/app/add-member.html
> 如有疑问,可以单独发贴咨询。

继续阅读 »

> 文档已迁移至新链接:https://uniapp.dcloud.net.cn/dev/app/add-member.html
> 如有疑问,可以单独发贴咨询。

收起阅读 »

上拉加载,不要拉到底才开始加载更多数据

更新MUI

官方的原生,上拉加载,每次都是拉到底才能触发加载事件, 不能拉到快离底部一定距离后就开始加载了,不需要用户等待


mui.init({  
                pullRefresh: {  
                    container: '#pullrefresh',  
                    down: {  
                        style:'circle',  
                        callback: pulldownRefresh  
                    },  
                    up: {  
                        contentrefresh: '正在加载...',  
                        callback: pullupRefresh  
                    }  
                }  
            });  

解决方案是: 要修改mui.js 文件,

  _init: function() {  
                var self = this;  
                //document.addEventListener('plusscrollbottom', this);  
                window.addEventListener('dragup', self);  
                document.addEventListener("plusscrollbottom", self);  
                self.scrollInterval = window.setInterval(function() {  
                    if (self.isScroll && !self.loading)   
                    {  
                 if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight)   
                        {  
                        self.isScroll = false; //放在这里是因为快速滚动的话,有可能检测时,还没到底,所以只要有滚动,没到底之前一直检测高度变化  
                            if (self.bottomPocket) {  
                                self.pullupLoading();  
                            }  
                        }  
                    }  
                }, 100);  
            }  

//修改 这一句, if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight)  , 官方写死的,+10,差不多拉到底才触发, 如果想让到一定距离后就触发,可以修改这个数值,  建议官方可以,整合到方法里去,可以自由设置。
继续阅读 »

官方的原生,上拉加载,每次都是拉到底才能触发加载事件, 不能拉到快离底部一定距离后就开始加载了,不需要用户等待


mui.init({  
                pullRefresh: {  
                    container: '#pullrefresh',  
                    down: {  
                        style:'circle',  
                        callback: pulldownRefresh  
                    },  
                    up: {  
                        contentrefresh: '正在加载...',  
                        callback: pullupRefresh  
                    }  
                }  
            });  

解决方案是: 要修改mui.js 文件,

  _init: function() {  
                var self = this;  
                //document.addEventListener('plusscrollbottom', this);  
                window.addEventListener('dragup', self);  
                document.addEventListener("plusscrollbottom", self);  
                self.scrollInterval = window.setInterval(function() {  
                    if (self.isScroll && !self.loading)   
                    {  
                 if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight)   
                        {  
                        self.isScroll = false; //放在这里是因为快速滚动的话,有可能检测时,还没到底,所以只要有滚动,没到底之前一直检测高度变化  
                            if (self.bottomPocket) {  
                                self.pullupLoading();  
                            }  
                        }  
                    }  
                }, 100);  
            }  

//修改 这一句, if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight)  , 官方写死的,+10,差不多拉到底才触发, 如果想让到一定距离后就触发,可以修改这个数值,  建议官方可以,整合到方法里去,可以自由设置。
收起阅读 »

安利一个mui的教学视频,hcoder刘海君老师的免费的公开课,帮助大家尽快掌握mui

安利一个mui的教学视频,hcoder刘海君老师的免费的公开课,帮助大家尽快掌握mui

课程地址: https://ke.qq.com/course/203400

接触(一)
【录播】MUI 介绍、新项目创建、 基础布局(13分钟)
【录播】MUI - accordion(折叠面板)、button(10分钟)
【录播】MUI - actionsheet(操作表)、badge(13分钟)
【录播】MUI - 复选框、单选框、使用js获取选择值(15分钟)
【录播】MUI - datepicker(时间选择器)(19分钟)
02
MUI 全接触(二)
【录播】MUI - dialog对话框、ipnut (表单)(23分钟)
【录播】MUI - slide(轮播组件)(17分钟)
【录播】MUI - list(列表/图文列表)(8分钟)
【录播】MUI - progressbar、滑块及switch(19分钟)
【录播】MUI - cardview、mask(遮罩蒙版)(13分钟)
03
MUI 全接触 (三)
【录播】MUI - 窗口管理及窗口之间的数据传递(30分钟)
【录播】MUI - 事件管理及自定义事件详解(26分钟)
【录播】APP与服务器之间的交互原理、MUI Ajax使用(22分钟)

继续阅读 »

安利一个mui的教学视频,hcoder刘海君老师的免费的公开课,帮助大家尽快掌握mui

课程地址: https://ke.qq.com/course/203400

接触(一)
【录播】MUI 介绍、新项目创建、 基础布局(13分钟)
【录播】MUI - accordion(折叠面板)、button(10分钟)
【录播】MUI - actionsheet(操作表)、badge(13分钟)
【录播】MUI - 复选框、单选框、使用js获取选择值(15分钟)
【录播】MUI - datepicker(时间选择器)(19分钟)
02
MUI 全接触(二)
【录播】MUI - dialog对话框、ipnut (表单)(23分钟)
【录播】MUI - slide(轮播组件)(17分钟)
【录播】MUI - list(列表/图文列表)(8分钟)
【录播】MUI - progressbar、滑块及switch(19分钟)
【录播】MUI - cardview、mask(遮罩蒙版)(13分钟)
03
MUI 全接触 (三)
【录播】MUI - 窗口管理及窗口之间的数据传递(30分钟)
【录播】MUI - 事件管理及自定义事件详解(26分钟)
【录播】APP与服务器之间的交互原理、MUI Ajax使用(22分钟)

收起阅读 »

分享一个mui扩展插件mui.showLoading加载框

showWaiting

写在前面:
好像mui目前dialog系列唯独缺少showLoading加载框(加载中)组件,为了统一组件样式和体验,写了这么一个扩展插件。
CSS和JS代码耦合性应该还是较低的,不妥之处欢迎指教!
优点:可以同时兼容Html5和plus,不必为不同环境单独分别Loading组件。
缺点:在页面嵌套情况下,遮罩仅对当前页面起作用。

使用方法:
显示加载框:

mui.showLoading("正在加载..","div"); //加载文字和类型,plus环境中类型为div时强制以div方式显示

隐藏加载框:

mui.hideLoading(callback);//隐藏后的回调函数

注意:
加载框只会显示一个,多次调用showLoading只会显示最后一次调用的内容。

Javascript代码:

//扩展mui.showLoading  
(function($, window) {  
    //显示加载框  
    $.showLoading = function(message,type) {  
        if ($.os.plus && type !== 'div') {  
            $.plusReady(function() {  
                plus.nativeUI.showWaiting(message);  
            });  
        } else {  
            var html = '';  
            html += '<i class="mui-spinner mui-spinner-white"></i>';  
            html += '<p class="text">' + (message || "数据加载中") + '</p>';  

            //遮罩层  
            var mask=document.getElementsByClassName("mui-show-loading-mask");  
            if(mask.length==0){  
                mask = document.createElement('div');  
                mask.classList.add("mui-show-loading-mask");  
                document.body.appendChild(mask);  
                mask.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
            }else{  
                mask[0].classList.remove("mui-show-loading-mask-hidden");  
            }  
            //加载框  
            var toast=document.getElementsByClassName("mui-show-loading");  
            if(toast.length==0){  
                toast = document.createElement('div');  
                toast.classList.add("mui-show-loading");  
                toast.classList.add('loading-visible');  
                document.body.appendChild(toast);  
                toast.innerHTML = html;  
                toast.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
            }else{  
                toast[0].innerHTML = html;  
                toast[0].classList.add("loading-visible");  
            }  
        }     
    };  

    //隐藏加载框  
      $.hideLoading = function(callback) {  
        if ($.os.plus) {  
            $.plusReady(function() {  
                plus.nativeUI.closeWaiting();  
            });  
        }   
        var mask=document.getElementsByClassName("mui-show-loading-mask");  
        var toast=document.getElementsByClassName("mui-show-loading");  
        if(mask.length>0){  
            mask[0].classList.add("mui-show-loading-mask-hidden");  
        }  
        if(toast.length>0){  
            toast[0].classList.remove("loading-visible");  
            callback && callback();  
        }  
      }  
})(mui, window);

CSS代码

/*----------------mui.showLoading---------------*/  
.mui-show-loading {  
    position: fixed;  
    padding: 5px;  
    width: 120px;  
    min-height: 120px;  
    top: 45%;  
    left: 50%;  
    margin-left: -60px;  
    background: rgba(0, 0, 0, 0.6);  
    text-align: center;  
    border-radius: 5px;  
    color: #FFFFFF;  
    visibility: hidden;  
    margin: 0;  
    z-index: 2000;  

    -webkit-transition-duration: .2s;  
    transition-duration: .2s;  
    opacity: 0;  
    -webkit-transform: scale(0.9) translate(-50%, -50%);  
    transform: scale(0.9) translate(-50%, -50%);  
    -webkit-transform-origin: 0 0;  
    transform-origin: 0 0;  
}  
.mui-show-loading.loading-visible {  
    opacity: 1;  
    visibility: visible;  
    -webkit-transform: scale(1) translate(-50%, -50%);  
    transform: scale(1) translate(-50%, -50%);  
}  
.mui-show-loading .mui-spinner{  
    margin-top: 24px;  
    width: 36px;  
    height: 36px;  
}  
.mui-show-loading .text {  
    line-height: 1.6;  
    font-family: -apple-system-font,"Helvetica Neue",sans-serif;  
    font-size: 14px;  
    margin: 10px 0 0;  
    color: #fff;  
}  

.mui-show-loading-mask {  
  position: fixed;  
  z-index: 1000;  
  top: 0;  
  right: 0;  
  left: 0;  
  bottom: 0;  
}  
.mui-show-loading-mask-hidden{  
    display: none !important;  
}

预览效果:

PS
我搞不懂为什么这个编辑器这么渣~

继续阅读 »

写在前面:
好像mui目前dialog系列唯独缺少showLoading加载框(加载中)组件,为了统一组件样式和体验,写了这么一个扩展插件。
CSS和JS代码耦合性应该还是较低的,不妥之处欢迎指教!
优点:可以同时兼容Html5和plus,不必为不同环境单独分别Loading组件。
缺点:在页面嵌套情况下,遮罩仅对当前页面起作用。

使用方法:
显示加载框:

mui.showLoading("正在加载..","div"); //加载文字和类型,plus环境中类型为div时强制以div方式显示

隐藏加载框:

mui.hideLoading(callback);//隐藏后的回调函数

注意:
加载框只会显示一个,多次调用showLoading只会显示最后一次调用的内容。

Javascript代码:

//扩展mui.showLoading  
(function($, window) {  
    //显示加载框  
    $.showLoading = function(message,type) {  
        if ($.os.plus && type !== 'div') {  
            $.plusReady(function() {  
                plus.nativeUI.showWaiting(message);  
            });  
        } else {  
            var html = '';  
            html += '<i class="mui-spinner mui-spinner-white"></i>';  
            html += '<p class="text">' + (message || "数据加载中") + '</p>';  

            //遮罩层  
            var mask=document.getElementsByClassName("mui-show-loading-mask");  
            if(mask.length==0){  
                mask = document.createElement('div');  
                mask.classList.add("mui-show-loading-mask");  
                document.body.appendChild(mask);  
                mask.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
            }else{  
                mask[0].classList.remove("mui-show-loading-mask-hidden");  
            }  
            //加载框  
            var toast=document.getElementsByClassName("mui-show-loading");  
            if(toast.length==0){  
                toast = document.createElement('div');  
                toast.classList.add("mui-show-loading");  
                toast.classList.add('loading-visible');  
                document.body.appendChild(toast);  
                toast.innerHTML = html;  
                toast.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
            }else{  
                toast[0].innerHTML = html;  
                toast[0].classList.add("loading-visible");  
            }  
        }     
    };  

    //隐藏加载框  
      $.hideLoading = function(callback) {  
        if ($.os.plus) {  
            $.plusReady(function() {  
                plus.nativeUI.closeWaiting();  
            });  
        }   
        var mask=document.getElementsByClassName("mui-show-loading-mask");  
        var toast=document.getElementsByClassName("mui-show-loading");  
        if(mask.length>0){  
            mask[0].classList.add("mui-show-loading-mask-hidden");  
        }  
        if(toast.length>0){  
            toast[0].classList.remove("loading-visible");  
            callback && callback();  
        }  
      }  
})(mui, window);

CSS代码

/*----------------mui.showLoading---------------*/  
.mui-show-loading {  
    position: fixed;  
    padding: 5px;  
    width: 120px;  
    min-height: 120px;  
    top: 45%;  
    left: 50%;  
    margin-left: -60px;  
    background: rgba(0, 0, 0, 0.6);  
    text-align: center;  
    border-radius: 5px;  
    color: #FFFFFF;  
    visibility: hidden;  
    margin: 0;  
    z-index: 2000;  

    -webkit-transition-duration: .2s;  
    transition-duration: .2s;  
    opacity: 0;  
    -webkit-transform: scale(0.9) translate(-50%, -50%);  
    transform: scale(0.9) translate(-50%, -50%);  
    -webkit-transform-origin: 0 0;  
    transform-origin: 0 0;  
}  
.mui-show-loading.loading-visible {  
    opacity: 1;  
    visibility: visible;  
    -webkit-transform: scale(1) translate(-50%, -50%);  
    transform: scale(1) translate(-50%, -50%);  
}  
.mui-show-loading .mui-spinner{  
    margin-top: 24px;  
    width: 36px;  
    height: 36px;  
}  
.mui-show-loading .text {  
    line-height: 1.6;  
    font-family: -apple-system-font,"Helvetica Neue",sans-serif;  
    font-size: 14px;  
    margin: 10px 0 0;  
    color: #fff;  
}  

.mui-show-loading-mask {  
  position: fixed;  
  z-index: 1000;  
  top: 0;  
  right: 0;  
  left: 0;  
  bottom: 0;  
}  
.mui-show-loading-mask-hidden{  
    display: none !important;  
}

预览效果:

PS
我搞不懂为什么这个编辑器这么渣~

收起阅读 »

动态修改app桌面图标

经过半年的潜心研究,发现dcound越来越强大,对dcound充满信心。

回归正题,主要是希望app里能增加一个动态修改app桌面图标的功能,如某宝在双11、双12时,桌面图标会改变,也有类似一些分区域的app,会在app桌面图标上显示当地城市的名称。

继续阅读 »

经过半年的潜心研究,发现dcound越来越强大,对dcound充满信心。

回归正题,主要是希望app里能增加一个动态修改app桌面图标的功能,如某宝在双11、双12时,桌面图标会改变,也有类似一些分区域的app,会在app桌面图标上显示当地城市的名称。

收起阅读 »

[解决]打开文件服务失败,请尝试拔掉数据线后重新连接手机

真机调试

连接ios测试时有时连不上,显示:

正在建立手机连接...
正在同步手机端程序文件...
打开文件服务失败,请尝试拔掉数据线后重新连接手机

摸索发现正确姿势是先连手机,再打开hbuilder。

ps.运行→真机→hbuilder基座测试,不用每次都等打包 。
psps.未受信任:设置→通用→设备管理→找到beijing那个信任。

继续阅读 »

连接ios测试时有时连不上,显示:

正在建立手机连接...
正在同步手机端程序文件...
打开文件服务失败,请尝试拔掉数据线后重新连接手机

摸索发现正确姿势是先连手机,再打开hbuilder。

ps.运行→真机→hbuilder基座测试,不用每次都等打包 。
psps.未受信任:设置→通用→设备管理→找到beijing那个信任。

收起阅读 »

h5+ 跨平台 app开发学习路线及对应视频教程

5+App开发 mui

《JavaScript 快速提高视频教程》 js基础快速提高课程 【免费】
http://www.hcoder.net/course/info_229.html

《MUI 视频教程》【免费】
http://www.hcoder.net/course/info_211.html

《h.js 视频教程》【免费】
http://www.hcoder.net/tutorials/info_147.html

《HTML 5 开发教程》【免费】
http://www.hcoder.net/course/info_212.html

《APP开发实例教程 - 窗口切换 》【免费】
http://www.hcoder.net/course/info_218.html

《HBuilder 8.0.1 APP开发 - 新功能全接触》【免费】
http://www.hcoder.net/course/info_227.html

--------- 实战收费教程 ------------------------

MUI、H5 APP 实战教程 - 仿《有道词典》
https://ke.qq.com/course/194834

H5 跨平台APP开发电商项目实战教程 -《仿京东优选商城》
https://ke.qq.com/course/225830

更多课程中心
http://www.hcoder.net/course

继续阅读 »

《JavaScript 快速提高视频教程》 js基础快速提高课程 【免费】
http://www.hcoder.net/course/info_229.html

《MUI 视频教程》【免费】
http://www.hcoder.net/course/info_211.html

《h.js 视频教程》【免费】
http://www.hcoder.net/tutorials/info_147.html

《HTML 5 开发教程》【免费】
http://www.hcoder.net/course/info_212.html

《APP开发实例教程 - 窗口切换 》【免费】
http://www.hcoder.net/course/info_218.html

《HBuilder 8.0.1 APP开发 - 新功能全接触》【免费】
http://www.hcoder.net/course/info_227.html

--------- 实战收费教程 ------------------------

MUI、H5 APP 实战教程 - 仿《有道词典》
https://ke.qq.com/course/194834

H5 跨平台APP开发电商项目实战教程 -《仿京东优选商城》
https://ke.qq.com/course/225830

更多课程中心
http://www.hcoder.net/course

收起阅读 »

关于MUI中NumberBox任意浮点数、整数加减的优化

numbox 技术分享

最近刚有个数字输入框浮点数输入、加减的需求。

查询社区只有http://ask.dcloud.net.cn/article/477这一篇文章的建议是替换源码中parseInt为parseFloat,

但觉得这个方法并不完全解决js中浮点数相加结果异常的问题。

于是对mui.js中的numberbox部分进行适当修改,实现任意浮点数、整数加减的需求。

代码如下,可直接复制粘贴到mui.js8024行处进行替换:

 (function($) {  

    var touchSupport = ('ontouchstart' in document);  
    var tapEventName = touchSupport ? 'tap' : 'click';  
    var changeEventName = 'change';  
    var holderClassName = 'mui-numbox';  
    var plusClassSelector = '.mui-btn-numbox-plus,.mui-numbox-btn-plus';  
    var minusClassSelector = '.mui-btn-numbox-minus,.mui-numbox-btn-minus';  
    var inputClassSelector = '.mui-input-numbox,.mui-numbox-input';  

    var Numbox = $.Numbox = $.Class.extend({  
        /**  
         * 构造函数  
         **/  
        init: function(holder, options) {  
            var self = this;  
            if (!holder) {  
                throw "构造 numbox 时缺少容器元素";  
            }  
            self.holder = holder;  
            options = options || {};  
            options.step = parseFloat(options.step || 1);  
            self.options = options;  
            self.input = $.qsa(inputClassSelector, self.holder)[0];  
            self.plus = $.qsa(plusClassSelector, self.holder)[0];  
            self.minus = $.qsa(minusClassSelector, self.holder)[0];  
            self.checkValue();  
            self.initEvent();  
        },  
        /**  
         * 初始化事件绑定  
         **/  
        initEvent: function() {  
            var self = this;  
            var add = function(arg1,arg2){  
                    var r1,r2,m,n;   
                try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}   
                try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}   
                m=Math.pow(10,Math.max(r1,r2));  
                n=(r1>=r2)?r1:r2;  
                return ((arg1*m+arg2*m)/m).toFixed(n);    
            };  

            var sub = function(arg1,arg2){  
                 var r1,r2,m,n;   
                 try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}   
                 try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}   
                 m=Math.pow(10,Math.max(r1,r2));   
                 n=(r1>=r2)?r1:r2;   
                 return ((arg1*m-arg2*m)/m).toFixed(n);   
            };  

            self.plus.addEventListener(tapEventName, function(event) {  
                var val = add(parseFloat(self.input.value),self.options.step);   
                self.input.value = val.toString();  
                $.trigger(self.input, changeEventName, null);   
            });  
            self.minus.addEventListener(tapEventName, function(event) {  
                var val = sub(parseFloat(self.input.value),self.options.step);  
                self.input.value = val.toString();  
                $.trigger(self.input, changeEventName, null);  
            });  
            self.input.addEventListener(changeEventName, function(event) {  
                var val = self.input.value;   
                self.checkValue();  
                //触发顶层容器  
                $.trigger(self.holder, changeEventName, {  
                    value: val  
                 });  
            });  
        },  
        /**  
         * 获取当前值  
         **/  
        getValue: function() {  
            var self = this;  
            return parseFloat(self.input.value);  
        },  
        /**  
         * 验证当前值是法合法  
         **/  
        checkValue: function() {  
            var self = this;  
            var val = self.input.value;  
            if (val == null || val == '' || isNaN(val)) {  
                self.input.value = self.options.min || 0;  
                self.minus.disabled = self.options.min != null;  
            } else {  
                var val = parseFloat(val);  
                if (self.options.max != null && !isNaN(self.options.max) && val >= parseFloat(self.options.max)) {  
                    val = self.options.max;  
                    self.plus.disabled = true;  
                } else {  
                    self.plus.disabled = false;  
                }  
                if (self.options.min != null && !isNaN(self.options.min) && val <= parseFloat(self.options.min)) {  
                    val = self.options.min;  
                    self.minus.disabled = true;  
                } else {  
                    self.minus.disabled = false;  
                }  
                self.input.value = val;  
            }  
        },  
        /**  
         * 更新选项  
         **/  
        setOption: function(name, value) {  
            var self = this;  
            self.options[name] = value;  
        },  
        /**  
         * 动态设置新值  
         **/  
        setValue: function(value) {  
            this.input.value = value;  
            this.checkValue();  
        }  
    });  

    $.fn.numbox = function(options) {  
        var instanceArray = [];  
        //遍历选择的元素  
        this.each(function(i, element) {  
            if (element.numbox) {  
                return;  
            }  
            if (options) {  
                element.numbox = new Numbox(element, options);  
            } else {  
                var optionsText = element.getAttribute('data-numbox-options');  
                var options = optionsText ? JSON.parse(optionsText) : {};  
                options.step = element.getAttribute('data-numbox-step') || options.step;  
                options.min = element.getAttribute('data-numbox-min') || options.min;  
                options.max = element.getAttribute('data-numbox-max') || options.max;  
                element.numbox = new Numbox(element, options);  
            }  
        });  
        return this[0] ? this[0].numbox : null;  
    }  

    //自动处理 class='mui-locker' 的 dom  
    $.ready(function() {  
        $('.' + holderClassName).numbox();  
    });  

}(mui));
继续阅读 »

最近刚有个数字输入框浮点数输入、加减的需求。

查询社区只有http://ask.dcloud.net.cn/article/477这一篇文章的建议是替换源码中parseInt为parseFloat,

但觉得这个方法并不完全解决js中浮点数相加结果异常的问题。

于是对mui.js中的numberbox部分进行适当修改,实现任意浮点数、整数加减的需求。

代码如下,可直接复制粘贴到mui.js8024行处进行替换:

 (function($) {  

    var touchSupport = ('ontouchstart' in document);  
    var tapEventName = touchSupport ? 'tap' : 'click';  
    var changeEventName = 'change';  
    var holderClassName = 'mui-numbox';  
    var plusClassSelector = '.mui-btn-numbox-plus,.mui-numbox-btn-plus';  
    var minusClassSelector = '.mui-btn-numbox-minus,.mui-numbox-btn-minus';  
    var inputClassSelector = '.mui-input-numbox,.mui-numbox-input';  

    var Numbox = $.Numbox = $.Class.extend({  
        /**  
         * 构造函数  
         **/  
        init: function(holder, options) {  
            var self = this;  
            if (!holder) {  
                throw "构造 numbox 时缺少容器元素";  
            }  
            self.holder = holder;  
            options = options || {};  
            options.step = parseFloat(options.step || 1);  
            self.options = options;  
            self.input = $.qsa(inputClassSelector, self.holder)[0];  
            self.plus = $.qsa(plusClassSelector, self.holder)[0];  
            self.minus = $.qsa(minusClassSelector, self.holder)[0];  
            self.checkValue();  
            self.initEvent();  
        },  
        /**  
         * 初始化事件绑定  
         **/  
        initEvent: function() {  
            var self = this;  
            var add = function(arg1,arg2){  
                    var r1,r2,m,n;   
                try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}   
                try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}   
                m=Math.pow(10,Math.max(r1,r2));  
                n=(r1>=r2)?r1:r2;  
                return ((arg1*m+arg2*m)/m).toFixed(n);    
            };  

            var sub = function(arg1,arg2){  
                 var r1,r2,m,n;   
                 try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}   
                 try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}   
                 m=Math.pow(10,Math.max(r1,r2));   
                 n=(r1>=r2)?r1:r2;   
                 return ((arg1*m-arg2*m)/m).toFixed(n);   
            };  

            self.plus.addEventListener(tapEventName, function(event) {  
                var val = add(parseFloat(self.input.value),self.options.step);   
                self.input.value = val.toString();  
                $.trigger(self.input, changeEventName, null);   
            });  
            self.minus.addEventListener(tapEventName, function(event) {  
                var val = sub(parseFloat(self.input.value),self.options.step);  
                self.input.value = val.toString();  
                $.trigger(self.input, changeEventName, null);  
            });  
            self.input.addEventListener(changeEventName, function(event) {  
                var val = self.input.value;   
                self.checkValue();  
                //触发顶层容器  
                $.trigger(self.holder, changeEventName, {  
                    value: val  
                 });  
            });  
        },  
        /**  
         * 获取当前值  
         **/  
        getValue: function() {  
            var self = this;  
            return parseFloat(self.input.value);  
        },  
        /**  
         * 验证当前值是法合法  
         **/  
        checkValue: function() {  
            var self = this;  
            var val = self.input.value;  
            if (val == null || val == '' || isNaN(val)) {  
                self.input.value = self.options.min || 0;  
                self.minus.disabled = self.options.min != null;  
            } else {  
                var val = parseFloat(val);  
                if (self.options.max != null && !isNaN(self.options.max) && val >= parseFloat(self.options.max)) {  
                    val = self.options.max;  
                    self.plus.disabled = true;  
                } else {  
                    self.plus.disabled = false;  
                }  
                if (self.options.min != null && !isNaN(self.options.min) && val <= parseFloat(self.options.min)) {  
                    val = self.options.min;  
                    self.minus.disabled = true;  
                } else {  
                    self.minus.disabled = false;  
                }  
                self.input.value = val;  
            }  
        },  
        /**  
         * 更新选项  
         **/  
        setOption: function(name, value) {  
            var self = this;  
            self.options[name] = value;  
        },  
        /**  
         * 动态设置新值  
         **/  
        setValue: function(value) {  
            this.input.value = value;  
            this.checkValue();  
        }  
    });  

    $.fn.numbox = function(options) {  
        var instanceArray = [];  
        //遍历选择的元素  
        this.each(function(i, element) {  
            if (element.numbox) {  
                return;  
            }  
            if (options) {  
                element.numbox = new Numbox(element, options);  
            } else {  
                var optionsText = element.getAttribute('data-numbox-options');  
                var options = optionsText ? JSON.parse(optionsText) : {};  
                options.step = element.getAttribute('data-numbox-step') || options.step;  
                options.min = element.getAttribute('data-numbox-min') || options.min;  
                options.max = element.getAttribute('data-numbox-max') || options.max;  
                element.numbox = new Numbox(element, options);  
            }  
        });  
        return this[0] ? this[0].numbox : null;  
    }  

    //自动处理 class='mui-locker' 的 dom  
    $.ready(function() {  
        $('.' + holderClassName).numbox();  
    });  

}(mui));
收起阅读 »

个推中plus.push.getClientInfo()获取clientId为null的解决方法

1、android中删除所有关于小米推送的权限和配置。
2、删除个推中下面的服务,解决小米5手机中无法获取clientId的问题

 <service  
            android:name="com.igexin.download.DownloadService"  
            android:process=":pushservice"/>  
        <receiver android:name="com.igexin.download.DownloadReceiver">  
            <intent-filter>  
                <action android:name="android.net.conn.CONNECTIVITY_CHANGE"/>  
            </intent-filter>  
        </receiver>  
        <provider  
            android:name="com.igexin.download.DownloadProvider"  
            android:authorities="downloads.com.tengluo.zhxf"  
            android:exported="true"  
            android:process=":pushservice"/>  
        <receiver android:name="io.dcloud.feature.apsGt.GTNotificationReceiver">  
            <intent-filter>  
                <action android:name="android.intent.action.BOOT_COMPLETED"/>  
                <action android:name="com.tengluo.zfapp.__CREATE_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__REMOVE_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__CLEAR_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__CLILK_NOTIFICATION"/>  
            </intent-filter>  
        </receiver>
继续阅读 »

1、android中删除所有关于小米推送的权限和配置。
2、删除个推中下面的服务,解决小米5手机中无法获取clientId的问题

 <service  
            android:name="com.igexin.download.DownloadService"  
            android:process=":pushservice"/>  
        <receiver android:name="com.igexin.download.DownloadReceiver">  
            <intent-filter>  
                <action android:name="android.net.conn.CONNECTIVITY_CHANGE"/>  
            </intent-filter>  
        </receiver>  
        <provider  
            android:name="com.igexin.download.DownloadProvider"  
            android:authorities="downloads.com.tengluo.zhxf"  
            android:exported="true"  
            android:process=":pushservice"/>  
        <receiver android:name="io.dcloud.feature.apsGt.GTNotificationReceiver">  
            <intent-filter>  
                <action android:name="android.intent.action.BOOT_COMPLETED"/>  
                <action android:name="com.tengluo.zfapp.__CREATE_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__REMOVE_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__CLEAR_NOTIFICATION"/>  
                <action android:name="com.tengluo.zfapp.__CLILK_NOTIFICATION"/>  
            </intent-filter>  
        </receiver>
收起阅读 »

H5+ APP开发教程汇总(知识点+实战)

移动APP mui


《JavaScript 快速提高视频教程》 js基础快速提高课程 【免费】
http://www.hcoder.net/course/info_229.html

《MUI 视频教程》【免费】
http://www.hcoder.net/course/info_211.html

《h.js 视频教程》【免费】
http://www.hcoder.net/tutorials/info_147.html

《HTML 5 开发教程》【免费】
http://www.hcoder.net/course/info_212.html

《APP开发实例教程 - 窗口切换 》【免费】
http://www.hcoder.net/course/info_218.html

《HBuilder 8.0.1 APP开发 - 新功能全接触》【免费】
http://www.hcoder.net/course/info_227.html

--------- 实战收费教程 ------------------------

MUI、H5 APP 实战教程 - 仿《有道词典》
https://ke.qq.com/course/194834

H5 跨平台APP开发电商项目实战教程 -《仿京东优选商城》
https://ke.qq.com/course/225830

更多课程中心
http://www.hcoder.net/course

继续阅读 »


《JavaScript 快速提高视频教程》 js基础快速提高课程 【免费】
http://www.hcoder.net/course/info_229.html

《MUI 视频教程》【免费】
http://www.hcoder.net/course/info_211.html

《h.js 视频教程》【免费】
http://www.hcoder.net/tutorials/info_147.html

《HTML 5 开发教程》【免费】
http://www.hcoder.net/course/info_212.html

《APP开发实例教程 - 窗口切换 》【免费】
http://www.hcoder.net/course/info_218.html

《HBuilder 8.0.1 APP开发 - 新功能全接触》【免费】
http://www.hcoder.net/course/info_227.html

--------- 实战收费教程 ------------------------

MUI、H5 APP 实战教程 - 仿《有道词典》
https://ke.qq.com/course/194834

H5 跨平台APP开发电商项目实战教程 -《仿京东优选商城》
https://ke.qq.com/course/225830

更多课程中心
http://www.hcoder.net/course

收起阅读 »

图片轮播动态跳转报错 Uncaught TypeError: Cannot read property '0' of undefined

通过手动点击,动态获取图片索引,并跳转到指定图片;
可以在执行mui('.mui-slider').slider().gotoItem(index);报错Uncaught TypeError: Cannot read property '0' of undefined;
经过测试发现gotoItem()参数必须为数字,要不然就会报错;
修改为:mui('.mui-slider').slider().gotoItem(parseInt(index)); 问题解决!

继续阅读 »

通过手动点击,动态获取图片索引,并跳转到指定图片;
可以在执行mui('.mui-slider').slider().gotoItem(index);报错Uncaught TypeError: Cannot read property '0' of undefined;
经过测试发现gotoItem()参数必须为数字,要不然就会报错;
修改为:mui('.mui-slider').slider().gotoItem(parseInt(index)); 问题解决!

收起阅读 »