• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Ajax+smarty技术实现无刷新分页

    这里运用Smarty模板,更简单

    本文主要的技术:AJAX,PHP,Smarty,另外自己封装了一个很简单的类

    类:

      (function(){
    function $(id) {
    return document.getElementById(id);
    }
    $.init=function() {
    try{return new XMLHttpRequest();}catch(e){};
    try{return new ActiveXObject('Microsoft.XMLHTTP');}catch(e){}
    alert('请更换浏览器');
    }
    $.get=function (url,data,callback,type) {
    var xhr = this.init();
    url += '?' +new Date().getTime();
    if(data!=null){
    url += ''+data;
    }
    xhr.open('get',url);
    xhr.onreadystatechange = function () {
    if(xhr.readyState == 4  xhr.status == 200){
    if(type==null){
    callback(xhr.responseText);
    }
    if(type == 'text'){
    callback(xhr.responseText);
    }
    if(type == 'xml'){
    callback(xhr.responseXML);
    }
    if(type == 'json'){
    callback(eval("("+xhr.responseText+")"));
    }
    }
    }
    xhr.send(null);
    }
    
    $.post = function (url,data,callback,type) {
    var xhr = this.init();
    xhr.open('post',url);
    xhr.setRequestHeader('Content-Type','Application/x-www-form-urlencoded');
    xhr.onreadystatechange = function () {
    if(xhr.readyState == 4  xhr.status == 200){
    if(type==null){
    callback(xhr.responseText);
    }
    if(type == 'text'){
    callback(xhr.responseText);
    }
    if(type == 'xml'){
    callback(xhr.responseXML);
    }
    if(type == 'json'){
    callback(eval("("+xhr.responseText+")"));
    }
    }
    }; 
    xhr.send(data);
    }

     类很简单,不介绍了

    HTML:

      window.onload=function () {
    init(2);
    }
    function del(id,p){
    $.get('del.php','id='+id,function(msg){
    if(msg==1){
    init(p);
    }
    })
    }
    function init(p) {
    $.get('page.php','page='+p,function(msg){
    $('result').innerHTML=msg;
    });
    }
    
    PHP:
    
    ?php
    header('content-type:text/html;charset=utf-8');
    mysql_connect('localhost','root','root');
    mysql_select_db('db2');
    mysql_query('set names utf8');
    $re=mysql_query('select count(*) as num from catgory');
    $hang=mysql_fetch_assoc($re);
    $row1=$hang['num'];
    $page=isset($_GET['page'])? $_GET['page']:1;
    $pagesize=2;
    $total=ceil($row1/$pagesize);
    $prev=$page-1;
    $next=$page+1;
    if($prev1){$prev=1;}
    if($next>$total){$next=$total;}
    $offset = ($page-1)*$pagesize;
    $result=mysql_query("select * from catgory limit ".$offset.','.$pagesize);
    $ct=mysql_num_rows($result);
    $data=array();
    for($i=0;$i$ct;$i++){
    $r=mysql_fetch_assoc($result);
    $data[]=$r;
    }
    include('libs/Smarty.class.php');
    $Smarty=new Smarty();
    $Smarty->assign('data',$data);
    $Smarty->assign('page',$page);
    $Smarty->assign('pagesize',$pagesize);
    $Smarty->assign('total',$total);
    $Smarty->assign('prev',$prev);
    $Smarty->assign('next',$next);
    $Smarty->assign('row1',$row1);
    $str=$Smarty->fetch('page.html');
    echo $str;

    Smarty:

        table border="1" rules="all" width="600">
    tr>
    td>编号/td>
    td>品牌/td>
    td>pid/td>
    td>删除/td>
    /tr>
    {foreach from=$data item='value'}
    tr>
    td>{$value['id']}/td>
    td>{$value['name']}/td>
    td>{$value['pid']}/td>
    td>a href="#", onclick="del({$value['id']},{$page})">删除/td>
    /tr>
    {/foreach}
    tr>
    td colspan="3">
    共{$total}页
    第{$page}页
    a href="#", onclick="init({$prev})">上一页/a>
    a href="#", onclick="init({$next})">下一页/a>
    a href="#", onclick="init(1)">第一页/a>
    a href="#", onclick="init({$total})">最末页/a>
    共{$row1}条数据
    每页{$pagesize}条数据
    /td>
    /tr>
    /table>

    要引入smary模板

    以上所述是小编给大家介绍的Ajax+smarty技术实现无刷新分页,希望对大家有所帮助!

    您可能感兴趣的文章:
    • smarty简单分页的实现方法
    • Smarty变量用法详解
    • Smarty环境配置与使用入门教程
    • PHP Smarty模版简单使用方法
    • Smarty安装配置方法
    • 在smarty中调用php内置函数的方法
    • ThinkPHP使用smarty模板引擎的方法
    • Smarty结合Ajax实现无刷新留言本实例
    • Smarty分页实现方法完整实例
    上一篇:Ajax教程实例详解
    下一篇:AJAX实现跨域的三种方法(代理,JSONP,XHR2)
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    Ajax+smarty技术实现无刷新分页 Ajax+smarty,技术,实现,无,