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

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    ajax实现改变状态和删除无刷新的实例

    1. 01.php为主程序,调用smarty模板遍历输出:

    ?php
      include './include/Mysql.class.php';
      include './libs/Smarty.class.php';
      $db=new Mysql;
      $smarty=new Smarty;
      $lists=$db->getALL('users');
      $smarty->assign('lists',$lists);
      $smarty->display('list.html');
    ?>

    2. list.html模板:内容结合JS ajax使用:

    !DOCTYPE html>
    html>
    head>
      meta charset=utf-8>
      title>用户权限展示表/title>
    /head>
    body>
        //给table体设置一个div,方便js调用
        div id="table">
        table align="center" border="1" width="500">
          center>h2>用户权限表/h2>/center>
          tr>
            th>uid/th>th>用户名/th>th>密码/th>th>锁定状态/th>th>角色/th>th>操作/th>
          /tr>  
          {foreach $lists as $list}
            tr align="center">
              td>{$list.uid}/td>
              td>{$list.username}/td>
              td>{$list.password}/td>
              {if $list.is_lock==1}
                td>a href="javascript:lock(0,{$list.uid});" rel="external nofollow" >锁定/a>/td>
                {else}
                td>a href="javascript:lock(1,{$list.uid})" rel="external nofollow" ;>取消锁定/a>/td>  
              {/if}    
              {if $list.role==1}
                  td>管理员/td>
              {else}
                  td>编辑者/td>    
              {/if}
              td>a href="javascript:del({$list.uid})" rel="external nofollow" >删除/a>/td>
            /tr>    
          {/foreach}  
        /table>
        /div>  
    /body>
        script type="text/javascript">
          function lock(lock,uid){
              //创建ajax对象
              var xhr=new XMLHttpRequest();
              //打开一个链接
              xhr.open('post','02.php');
              //设置头信息
              xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
              //取值,多个参数用分开
              var data="is_lock="+lock+"uid="+uid;
              //发送ajax数据请求
              xhr.send(data);
              //设置回调、监听函数
              xhr.onreadystatechange=function(){
                //如果ajax状态码响应正常且网络正常,获取响应文本
                if(xhr.readyState==4xhr.status==200){
                  if(xhr.responseText){
                    document.getElementById('table').innerHTML=xhr.responseText;
                  }else{
                    alert("切换状态失败!");
                  }
                }
              }
            }
        function del(uid){
          var del=window.confirm("您确定要删除吗?");
          if(del){
            //创建ajax对象
            var xhr=new XMLHttpRequest();
            //打开一个链接
            xhr.open('post','del.php');
            //设置header头
            xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
            //data取值
            var data="uid="+uid;
            //发送ajax请求
            xhr.send(data);
            //设置监听
            xhr.onreadystatechange=function(){
              //如果ajax状态码响应正常且网络正常,获取响应文本
              if(xhr.readyState==4xhr.status==200){
                if(xhr.responseText){
                  //用ajax响应内容替换本模板中table标签的内容
                  document.getElementById('table').innerHTML=xhr.responseText;
                }else{
                  alert("删除失败!");
                }
              }
            }
          }
        }    
        /script>
    /html>
    

    3. 02.php改变状态无刷新:

    ?php
      include './include/Mysql.class.php';
      include './libs/Smarty.class.php';
      $lock=$_POST['is_lock'];
      $uid=$_POST['uid'];
      $smarty=new Smarty;
      $db=new Mysql;
      $result=$db->update('users',"is_lock=$lock","uid=$uid");
      if($result){
        //修改成功重新遍历数据库并输出smarty模板
        $lists=$db->getALL('users');
        $smarty->assign('lists',$lists);
        $smarty->display('list.html');
      }else{
        echo false;
      }
    ?>
    

    4.del.php实现删除无刷新

    ?php
      include './include/Mysql.class.php';
      include './libs/Smarty.class.php';
      $db=new Mysql;
      $smarty=new Smarty;
      $uid=$_POST['uid'];
      $res=$db->delete('users',$uid);
      if($res>0){
        $lists=$db->getALL('users');
        $smarty->assign('lists',$lists);
        $smarty->display('list.html');
      }else{
        echo false;
      }
    ?>

    以上这篇ajax实现改变状态和删除无刷新的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

    您可能感兴趣的文章:
    • jquery ajax 局部无刷新更新数据的实现案例
    • 浅谈Ajax技术实现页面无刷新
    • PHP+ajax 无刷新删除数据
    • ajax实现页面加载和内容删除
    上一篇:快速解决ajax请求出错状态码为0的问题
    下一篇:ajax结合mysql数据库和smarty实现局部数据状态的刷新方法
  • 相关文章
  • 

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

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

    ajax实现改变状态和删除无刷新的实例 ajax,实现,改变,状态,和,