l***@brain-c.com
l***@brain-c.com
  • 发布:2018-04-18 04:06
  • 更新:2018-04-18 12:44
  • 阅读:1012

關於loading button 跟ajax

分类:MUI

当我在 mui(this).button('loading'); 后使用ajax

按键的状态不会改变

是我漏了什么吗?

mui(document.body).on('tap', '.mui-btn',  
                function(e) {  
                    mui(this).button('loading');  
                    if(this.id === 'login') {  
                        console.log('login');  
                        mui.ajax('http://xxx/login.php', {  
                            data: {  
                                account: document.getElementById('account').toString(),  
                                pwd: md5(document.getElementById('password').toString())  
                            },  
                            dataType: 'json', //服务器返回json格式数据  
                            type: 'POST', //HTTP请求类型  
                            async: false,  
                            timeout: 10000, //超时时间设置为10秒;   
                            success: function(data) {  
                                console.log(data['type']);  

                                if(data['type'] == 0) {  
                                    localStorage.setItem('session', data['session']);  
                                    if (document.getElementById('autoLoginValue').value == 1)  
                                    {  
                                        console.log('save user and password');  
                                        localStorage.setItem('userAccount', document.getElementById('account').value);  
                                        localStorage.setItem('userPassword', document.getElementById('password').value);   
                                    }else{  
                                        console.log('remove user and password');  
                                        localStorage.removeItem('userAccount');  
                                        localStorage.removeItem('userPassword');  
                                    }  
                                    session = localStorage.getItem('session');  
                                    console.log('login Success.');  
                                    stat = true;  
                                } else {  
                                    //localStorage.remove('session');  
                                    console.log('login fail.');  
                                    stat = false;  
                                };  

                            },  
                            error: function(xhr, type, errorThrown) {  
                                //异常处理;  
                                console.log('login error:')  
                                console.log(xhr);  
                                console.log(type);  
                                console.log(errorThrown);  
                            }  
                        });  

                    }  
                    console.log('end');  
                    mui(this).button('reset');  
                });
2018-04-18 04:06 负责人:无 分享
已邀请:
Trust

Trust - 少说废话

ajax 请求结束后,需要调整组件的状态,不会自动变化的。
在 success 回调中,重置。

mui(btnElem).button('reset');
l***@brain-c.com

l***@brain-c.com (作者) - 不务正业的男人

发现我的例子有没有把button 定义好...
我分别在下面几次点输出了 consone.log

[Web浏览器] "login" /HelloHBuilder/users/login.html (157)
[Web浏览器] "0" /HelloHBuilder/users/login.html (168)
[Web浏览器] "remove user and password" /HelloHBuilder/users/login.html (178)
[Web浏览器] "login Success." /HelloHBuilder/users/login.html (184)
[Web浏览器] "end" /HelloHBuilder/users/login.html (203)

  1. button.button('loading'); 要等ajax 执行完才生效
  2. 也就是如果我没有button.button('reset');的话,要等ajax 执行完,画面才会开始显示loading....
  3. 如果我有button.button('reset')的话,画面就“不会”有loading
mui(document.body).on('tap', '.mui-btn',  
                function(e) {  
                    button = mui(this);  
                    button.button('loading');  
                    if(this.id === 'login') {  
                        console.log('login');  
                        mui.ajax('http://xxx/login.php', {  
                            data: {  
                                account: document.getElementById('account').toString(),  
                                pwd: md5(document.getElementById('password').toString())  
                            },  
                            dataType: 'json', //服务器返回json格式数据  
                            type: 'POST', //HTTP请求类型  
                            async: false,  
                            timeout: 10000, //超时时间设置为10秒;   
                            success: function(data) {  
                                console.log(data['type']);  
                                button.button('reset');                               
                                if(data['type'] == 0) {  
                                    localStorage.setItem('session', data['session']);  
                                    if (document.getElementById('autoLoginValue').value == 1)  
                                    {  
                                        console.log('save user and password');  
                                        localStorage.setItem('userAccount', document.getElementById('account').value);  
                                        localStorage.setItem('userPassword', document.getElementById('password').value);   
                                    }else{  
                                        console.log('remove user and password');  
                                        localStorage.removeItem('userAccount');  
                                        localStorage.removeItem('userPassword');  
                                    }  
                                    session = localStorage.getItem('session');  
                                    //goto('xxx','main');  
                                    console.log('login Success.');  
                                    stat = true;  
                                } else {  
                                    //localStorage.remove('session');  
                                    console.log('login fail.');  
                                    stat = false;  
                                };  

                            },  
                            error: function(xhr, type, errorThrown) {  
                                //异常处理;  
                                console.log('login error:')  
                                console.log(xhr);  
                                console.log(type);  
                                console.log(errorThrown);  
                            }  
                        });  

                    }  
                    console.log('end');  

                });  

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