当前位置:   article > 正文

HTML5页面在安卓手机端分页显示数据

手机分屏 html

最近项目中要跟安卓那边搞接口对接。安卓那边请求我的接口,现在的页面都是我自己用html5写的jsp页面。

首先引入已经封装好的js文件(ajaxRequest.js)。

 function autoLoadMessage(){

                var messagePn = document.getElementById("messagePN").value!=""?document.getElementById("messagePN").value:"${page_info.page}";

   var messagePageCount = "${page_info.total}";

var ajax = new AJAXRequest();

var nextPn = (Number(messagePn)+Number(1));

ajax.async = true;//异步AJAX 同步IE6下会出现多次请求 其它IE没有测试

if(nextPn<=${page_info.allPage}){

ajax.get("${pageContext.request.contextPath}/salesmanInter/doLoadList.do?page="+nextPn+"&STORE_NAME=" + "${STORE_NAME}",

      function(obj) {

if(obj.responseText){

var contianer = document.createElement("div");

contianer.innerHTML = obj.responseText;

document.getElementById("messageContent").appendChild(contianer);

document.getElementById("messagePN").value = nextPn; // 设置下一页

}

});

}

}

 

window.onscroll = function(){

var a = document.documentElement.clientHeight==0? document.body.clientHeight : document.documentElement.clientHeight;

var b = document.documentElement.scrollTop==0? document.body.scrollTop : document.documentElement.scrollTop;

var c = document.documentElement.scrollTop==0? document.body.scrollHeight : document.documentElement.scrollHeight;

if(a+b>=c){

autoLoadMessage();

}

}

 

这段代码就是当手机的页面向上滑动的时候自动加载下一页信息。messagePN这个字段要在jsp页面里写个隐藏域。${page_info.page}是当前页数,${page_info.total} 是总页数,都是我自己从后台传过来的。 当手机页面向上滑动的时候会触发这个js事件。这个事件调用到ajax.get 后面的URL。

注意事项:在页面开始的时候,你可能请求的是一个后台,后台跳转到整个jsp页面,但是,在这个ajax回调的时候最好单独再写一个后台,返回的页面是局部要刷新的页面,这个新页面只要写入你要填入的值就行

 

上面这段代码就是我要加载进来的,不需要重新加载之前的整个页面,这也是我建议最好重新单独写一个后台跳转到这个页面的原因。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/你好赵伟/article/detail/97416
推荐阅读
相关标签
  

闽ICP备14008679号