zoukankan      html  css  js  c++  java
  • 手机网站前端设计ajax 无限加载

    手机网站为了提高前端设计体验的时候,我们都会给前端加些比较好的交互式体验,下面就来说说如何用ajax无限加载分页,这是几年前做的笔记了,是帝国cms列表页无刷新加载,不会用的朋友可以留言,或者到我们的”厦门网站设计“网站技术栏目找,这里一般都是我们几个老技术员的经验笔记,还有很多关于PC、手机网站前端设计加体验的好技术文档。话不多说了下面就贴上代码给大家看看。

    第一步网页引入JQ库

    <script type="text/javascript" src="/js/jquery.js"></script>

    第二步:

    在网页内添加:<div id="more">(这个主要用于JQ加载数据把内容添加这个ID后面)

    第三步:添加下面的JS

    <script>“
    jQuery(function() {
    var pg=1;
    $('.tip-txt').click(function(){ 
    $.getJSON("/extend/clmore.php",{page:pg,cd:1},function(json){ 
    if(json){ 
    var str = ""; 
    $.each(json,function(index,array){ 
    var str="<div class=\\"item\\"><a href=\\""+array['url']+"/\\">"+array['title']+"</a></div>";
    $("#more").append(str); 
    }); 
    pg++;
    }
    else{ 
    $(".tip").show().html("已经到底了..."); 
    return false; 

    }); 
    } );
    });
    </script>

    第四步:二次开发建立一个clmore.php文件生成json数据

    <?php
    require('../../class/connect.php'); //引入数据库配置文件和公共函数文件
    require('../../class/db_sql.php'); //引入数据库操作文件
    $link=db_connect(); //连接MYSQL
    $empire=new mysqlquery(); //声明数据库操作类
    $editor=1; //声明目录层次

    $page = intval($_GET['page']);  //获取请求的页数 
    $cla = intval($_GET['cd']);  //获取请求的页数 
    $start = $page*6; 
    $sql=$empire->query("select * from {$dbtbpre}ecms_news order by newstime desc limit $start,6");
    while($r=$empire->fetch($sql)){
    $pic=$r[titlepic]?$r[titlepic]:'/e/data/images/notimg.gif';
    $sayList[] = array('url'=>$url, 'title'=>$r['title']); 
    }
    echo json_encode($sayList); 
    db_close(); //关闭MYSQL链接
    $empire=null; //注消操作类变量
    ?>

    第五步:完成上面四步,执行成功。

  • 相关阅读:
    LeetCode Array Easy 1. Two Sum
    关于VS2015 发布.net mvc 网站失败的问题
    2016计蒜之道复赛 百度地图的实时路况 floyd+cdq分治
    2016计蒜之道复赛 菜鸟物流的运输网络 网络流EK
    HDU5715 XOR 游戏 二分+字典树+dp
    HDU5697 刷题计划 dp+最小乘积生成树
    codeforces 687D Dividing Kingdom II 带权并查集(dsu)
    codeforces 687C
    codeforces 687B
    HDU 5693 D Game 区间dp
  • 原文地址:https://www.cnblogs.com/topcode/p/5995687.html
Copyright © 2011-2022 走看看