mui上拉加载,点击,与传参

    上拉加载

首先得有个容器:

<div  id="pullrefresh"  class="mui-content mui-scroll-wrapper"> 
    <div class="mui-scroll">
	    <ul class="mui-table-view " id="infoShow">
            列表内容.........
            </ul>
    </div>
</div>

 记住 容器class=“mui-scroll-wrapper”一定要有,不然划不动。

js部分

mui.init({
  swipeBack: false,
  pullRefresh: {
    container: '#pullrefresh',
    //上拉处理(此方式可以为上啦处理)
    up: {
      height:100,// 可选.默认50.触发上拉加载拖动距离
      auto:true,// 可选,默认false.自动上拉加载一次
      contentrefresh : "正在加载...",// 可选,正在加载状态时,上拉加载控件上显示的标题内容
      contentnomore:'没有更多数据了',
      callback: pulldownRefresh //上拉处理函数。
					
	}
					
  }
});

 写上拉加载具体实现

var count = 0;
var pullNum = 1;
function pulldownRefresh() {
  jsonstr = {
	"cmd":"getReceiveFileBox",
	"orgId":"141197",
	"userId":"65544",
	"domainId":"0",
	"pagerOffset":""+count+"",
	"pageSize":"15"
						
  }
  mui.ajax({
	type:"POST",
	//contentType:"application/x-www-form-urlencoded",
	url:utils.getAddress(),
	data:JSON.stringify(jsonstr),//参数对象序列化成json字符串
	async:true,
	datatype:"json",
	crossDomain:false,
	processData:false,//禁用对data的序列化
	timeout:5000,
	success:function(data,status,xhr){	
	  alert(data)
	  var jsonObj = JSON.parse(data);
	  var flag=jsonObj.output.data.result==null||jsonObj.output.data.result==undefined||jsonObj.output.data.result=='';
	  if(flag == false){
		count= pullNum*15;
		pullNum++;
		for(var i=0;i<jsonObj.output.data.result.length;i++){
          var writeOrgs = new Array();
          writeOrgs = jsonObj.output.data.result[i].writeOrg.split(".");
	     var li = document.createElement("li");
		li.setAttribute("title",jsonObj.output.data.result[i].title);
		li.setAttribute("fileType",jsonObj.output.data.result[i].wordType)
		li.className = "mui-table-view-cell mui-media";
		li.innerHTML  = '<a href="javascript:godetails()" id="suggestion"><div class="mui-media-body" style="  margin-top: 2%;"><h1 class="mui-table-view-shouwen">'+jsonObj.output.data.result[i].title+'</h1><p class="mui-ellipsis" id="mui-ellipsis-shouwen-p">'+jsonObj.output.data.result[i].createdTime+'</p><p class="mui-ellipsis" id="mui-ellipsis-shouwen-p1">'+jsonObj.output.data.result[i].byteNumber+'<span class="mui-ellipsis-span" id="mui-ellipsis-shouwen-p1-span">中原银行<span class="mui-ellipsis-span">'+writeOrgs[1]+'</span></span> </p></div></a>'
		document.body.querySelector("#infoShow").appendChild(li);
	  }	
		mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
	  }else{
		mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
	  }
						
						
	//点击事件跳转页面
						
	  mui("#infoShow").on('tap','li',function(){
	    var title = this.getAttribute("title");
	    var fileType = this.getAttribute("fileType");
		  mui.openWindow({
		    url:'db/suggestion/Attachment-Directory.html',
		    extras:{
		      title:title,
		      fileType:fileType
		    }
		  });
	  });		
							
							
	},					
	error:function(xhr,status,errorThrown) {
	  //status::"timeout"(超时), "error"(错误), "abort"(中止), "parsererror"(解析错误)
	  if(status=='timeout'){
		mui.toast("请求超时");
	  }else if(status=='error'){
		mui.toast("请求出错");
	  }else if(status=='abort'){
		mui.toast("当前无网络");
	  }else if(status=='parsererror'){
		mui.toast("解析错误");
	  }else{
	    mui.toast("未知异常");
	  }
	}
  });

}

 

 

 

 

 

 

 

 

 

posted @ 2017-09-28 17:37  一只蜗牛1  Views(587)  Comments(0)    收藏  举报