MUI框架学习

//第一种方式<button type="button" class='mui-btn mui-btn-danger mui-action-back'>关闭</button>

//第二种方式 默认没有启动，如需启动如下
mui.init({
    swipeBack:true                          //启用右滑关闭功能
});

mui.init({    beforeback: function(){        //获得列表界面的webview
        var list = plus.webview.getWebviewById('list');        //触发列表界面的自定义事件（refresh）,从而进行数据刷新
        mui.fire(list,'refresh');        //返回true，继续页面关闭逻辑
        return true;
    }
});

mui.init({  preloadPages:[
    {      url:prelaod-page-url,      id:preload-page-id,      styles:{},//窗口参数
      extras:{},//自定义扩展参数
      subpages:[{},{}]//预加载页面的子页面
    }
  ],  preloadLimit:5//预加载窗口数量限制(一旦超出,先进先出)默认不限制});

var page = mui.preload({    url:new-page-url,    id:new-page-id,//默认使用当前页面的url作为id
    styles:{},//窗口参数
    extras:{}//自定义扩展参数});

mui(".mui-table-view").on('tap','.mui-table-view-cell',function(){  //获取id
  var id = this.getAttribute("id");  //传值给详情页面，通知加载新数据
  mui.fire(detail,'getDetail',{id:id});  //打开新闻详情
  mui.openWindow({    id:'detail',    url:'detail.html'
  });
})

mui.init({  gestureConfig:{   tap: true, //默认为true
   doubletap: true, //默认为false
   longtap: true, //默认为false
   swipe: true, //默认为true
   drag: true, //默认为true
   hold:false,//默认为false，不监听
   release:false//默认为false，不监听
  }
});

mui.init({//子页面
    subpages: [{        //...
    }],//预加载
     preloadPages:[        //...
     ],//下拉刷新、上拉加载
    pullRefresh : {       //...
        },//手势配置
     gestureConfig:{       //...
    },//侧滑关闭
    swipeBack:true, //Boolean(默认false)启用右滑关闭功能
    //监听Android手机的back、menu按键
    keyEventBind: {        backbutton: false,  //Boolean(默认true)关闭back按键监听
        menubutton: false   //Boolean(默认true)关闭menu按键监听
    },//处理窗口关闭前的业务
    beforeback: function() {        //... //窗口关闭前处理其他业务详情点击 ↑ "关闭页面"链接查看
    },//设置状态栏颜色
    statusBarBackground: '#9defbcg', //设置状态栏颜色,仅iOS可用
    preloadLimit:5//预加载窗口数量限制(一旦超出,先进先出)默认不限制})

//obj1是mui对象var obj1 = mui("#title");//obj2是dom对象var obj2 = obj1[0];

var array = [1,2,3]
mui.each(array,function(index,item){  console.log(item*item);
})

<div class="mui-input-group">
  <div class="mui-input-row">
    <label>字段1：</label>
    <input type="text" class="mui-input-clear" id="col1" placeholder="请输入">
  </div>
  <div class="mui-input-row">
    <label>字段2：</label>
    <input type="text" class="mui-input-clear" id="col2" placeholder="请输入">
  </div>
  <div class="mui-input-row">
    <label>字段3：</label>
    <input type="text" class="mui-input-clear" id="col3" placeholder="请输入">
  </div></div>

var check = true;
mui(".mui-input-group input").each(function () {  //若当前input为空，则alert提醒
  if(!this.value||trim(this.value)==""){    var label = this.previousElementSibling;
    mui.alert(label.innerText+"不允许为空");
    check = false;    return false;
  }
});//校验通过，继续执行业务逻辑if(check){  //.....}

var target = {  company:"dcloud",  product:{    mui:"小巧、高效"
  }
} 
var obj1 = {  city:"beijing",  product:{    HBuilder:"飞一样的编码"
  }
}
mui.extend(target,obj1);//输出：{"company":"dcloud","product":{"HBuilder":"飞一样的编码"},"city":"beijing"}console.log(JSON.stringify(target));

var target = {  company:"dcloud",  product:{    mui:"小巧、高效"
  }
} 
var obj1 = {  city:"beijing",  product:{    HBuilder:"飞一样的编码"
  }
}//支持深度合并mui.extend(true,target,obj1);//输出：{"company":"dcloud","product":{"mui":"小巧、高效","HBuilder":"飞一样的编码"},"city":"beijing"}console.log(JSON.stringify(target));

mui.ajax(url,{    data:{        username:'username',        password:'password'
    },    dataType:'json',//服务器返回json格式数据
    type:'post',//HTTP请求类型
    timeout:10000,//超时时间设置为10秒；
    success:function(data){        //服务器返回响应，根据响应结果，分析是否登录成功；
        ...
    },    error:function(xhr,type,errorThrown){        //异常处理；
        console.log(type);
    }
});

mui.post('http://server-name/login.php',{        username:'username',        password:'password'
    },function(data){        //服务器返回响应，根据响应结果，分析是否登录成功；
        ...
    },'json');

mui.get('http://server-name/list.php',
    {category:'news'},    function(data){        //获得服务器响应
        ...
    },'json');

mui.getJSON('http://server-name/list.php',
    {category:'news'},    function(data){        //获得服务器响应
        ...
    }
);