手机端实现滑动底部加载，并数据库取出数据

主要是从http://jqweui.com/ 学习到的一款插件

主要是向下滑动的时候，从后台读取数据，而且读剩下的数据，奇思妙想 想到了一招。

<ul class="list_ul">      <volist name="info" id="v">      <li attr="<{$v.id}>">        <a href="<{:U('Company/thunder',array('id'=>$v['id']))}>" style="">          <figure>            <div>              <php>$images = string2array($v['image']);</php>              <img src="<{$images[0]}>">            </div>            <figcaption>              <{$v['title']}>             </figcaption>          </figure>        </a>      </li>      </volist>      </ul>

使用的thinkphp3.2框架， 

主要就是对待每个li标签增加一个attr属性，是图片的id

$(function(){  $(document.body).infinite(100);      var loading = false;  //状态标记      $(document.body).infinite().on("infinite", function() {      if(loading) return;      loading = true;      //获得最后一个li的id      setTimeout(function() {      var id = $('ul.list_ul li:last').attr('attr');        $.ajax({          type:'post',          url:'<{:U("company/style")}>',          data:{'p':1,'id':id},          success:function(msg){            msg = JSON.parse(msg)              var str = " ";              console.log(typeof msg) //object            $.each(msg,function(i,n){              console.log(typeof n.image)   //字符串               str +=  '<li attr="'+n.id+'"> <a href="<{:U("Company/thunder",array("id"=>'+n.id+'))}>" style=""> <figure> <div> <php>$images = string2array('+n.image+');</php> <img src="'+n.image.slice(14,37)+'"> </div> <figcaption> '+n.title+' </figcaption> </figure> </a> </li>'            })        $(".list_ul").append(str);          }        })        loading = false;      }, 1500);   //模拟延迟    });});

先调用插件里面的代码，主要是在回调函数那里使用ajax 把ul下的最后一个li的id值传递给服务端，服务端通过那个最后id进行where查询大于这个id并且取出10条。

if (IS_AJAX) {$id = I('post.id');$getInfo = M('CompanyThunder')->order('id')->where(array('id'=>array('gt',$id)))->limit(0,10)->select();echo json_encode($getInfo);}

<script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script> 引用的插件地址，