java中 什么是异步加载_[Java教程]移动开发中单页异步加载所有列表项

[Java教程]移动开发中单页异步加载所有列表项

0 2016-08-06 00:01:46

在做WEB开发的时候我们经常会遇到分页的处理，如果在PC上显示网页的话，使用传统的分页是可以接受的。那么，当我们为手机或其他移动端设计界面的话，使用分页未免有些笨拙和难以使用，这时候我们可以使用在单页加载所有列表项。当屏幕滑动到最低端的时候，会出现“点击加载更多”的按钮，当我们点击此按钮的时候，会加载更多的列表信息到当前页。当然，一切都是异步的，所以我们使用Jquery Ajax和后端ThinkPHP的Action通信。

下面先看看前端的代码：HTML

……已加载的列表项

点击加载更多

JavaScript：var p=1;

function more()

{

p++;

//alert(p);

$.get('/doc/more',{'page':p,'参数1':参数1的值,'参数2':参数2的值

……},function(data)

{

if(data)

$('#bikeList').append(data);

else

alert("已经没有更多信息了");

});

}

ThinkPHP Action中的代码：public function more($page,$sn,$bk,$fd,$dr)

{

$page=$_GET['page'];

$参数1=$_GET['参数1'];

$参数2=$_GET['参数2'];

……

$pcount=10;//每次加载的列表数

$bikeList=$this->getbikeList(参数1,参数2,……,$page,$pcount);

$this->bikeList=$bikeList;

$this->display();

}

为了方便起见，我们也为这里的More函数建立了视图，不用手写一大推HTML了，其视图代码 More.html如下：

具体列表项……

这里More.html输出的HTML代码就是前面Jquery函数more中的data参数的值。以上是我的一点开发经验的分享，希望能对你有所启发，期待与您的交流。

本文首发于顶求网，转载请注明来源

本文网址：http://www.shaoqun.com/a/245097.html

*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：admin@shaoqun.com。

异步

0