php ajax 点击'查看更多'小功能

最新推荐文章于 2021-08-06 09:34:21 发布

大泽是超人

最新推荐文章于 2021-08-06 09:34:21 发布

阅读量1k

点赞数

文章标签： php ajax

本文链接：https://blog.csdn.net/weixin_39967349/article/details/78313098

版权

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  <title>Document</title>
</head>
<body>
    <div id="nation">
      <volist name="data" id="vo">
          {$vo.id}</br>
      </volist>
    </div>
    <a class="sub" href="javascript:;">查看更多</a>
</body>
</html>
<script type="text/javascript">
    var page = 5 ;
    $(".sub").click(function(){
      page+=5
      $.ajax({
          url:"__CONTROLLER__/ajaxchuli",
          data:{page:page},
          type:"POST",
          dataType:"JSON",
          success: function(data2){
              for (var i = 0; i < data2.length; i++) {
                  // var tit = data2[i]["title"]
                  var id = data2[i]["id"]
                  $("#nation").append('<p>'+ id +'</p>')
              }
              // console.log(data)
          }
      })
    })
</script>

控制器

<?php
// 本类由系统自动生成，仅供测试用途
namespace Home\Controller;
use Think\Controller;
class CsController extends Controller {
    public function index(){
         $model = D('Note');
         $data = $model->order('id asc')->limit(10)->select();
         $this->assign('data',$data);
           $this->display(lst);
    }
    public function ajaxchuli(){
          $model = D('Note');
          $page=I('page');
          $data2 = $model->order('id asc')->limit($page,5)->select();
          echo json_encode($data2);
    }
}