• AJAX--显示、删除练习


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script src="../jquery-1.11.2.min.js"></script>//加载jquery包
    <style type="text/css">//美观删除加了css样式
    .shc{ 60px;
         height:25px;
         line-height:25px;
         text-align:center;
         vertical-align:middle;
         color:#FFF;
         background-color:#90F;}
    .shc:hover //鼠标覆盖background-color变色,同时鼠标变成小手
    {cursor:pointer;
    background-color:#FF6;
    color:#000;
    
    }
    
    </style>
    </head>
    
    <body>
    
    <table id="table" width="100%" border="1" cellpadding="0" cellspacing="0">
    
    </table>
    </body>
    <script type="text/javascript">
    $(document).ready(function(e){//jquery外层
        
            ShowAll();//调用ShowAll()
            ShanChu();//调用ShanChu()
            
        
       function ShowAll(){
        $.ajax({
            async:false,//将默认的异步改为同步,要不然程序因为没有接收无法继续执行
            url:"ChuLi.php",
            dataType:"TEXT",
            success:function(data){
                //alert(data);
                var str="<tr> <td>代号</td> <td>姓名</td> <td>性别</td> <td>民族</td> <td>生日</td> <td>操作</td></tr>";
                
                var hang=data.split("|");
                for(var i=0;i<hang.length;i++)
                  {
                      var lie=hang[i].split("^");
                         
            str+="<tr> <td>"+lie[0]+"</td> <td>"+lie[1]+"</td> <td>"+lie[2]+"</td> <td>"+lie[3]+"</td> <td>"+lie[4]+"</td> <td><div class='shc' zhj='"+lie[0]+"'>删除</div></td></tr>";//粗心知道可以自定义属性,也知道是根据主键来删除,可是忘记给zhj赋值了呃,所以运行不出来
            
            
                  }  
                   $("#table").html(str);
                }                
               });
       }
               function ShanChu(){
               $(".shc").click(function(){
                   var code=$(this).attr("zhj");
                   $.ajax({
                       async:false,//将默认的异步改为同步
                       url:"delete.php",//处理页面
                       data:{code:code},//json方式
                       type:"POST",//获取方式post,注意这里的post一定要加"",而且要大写
                       dataType:"TEXT",//注意:这里的dataType中的T一定要大写
                       success: function(data){
                           if(data.trim()=="ok")
                           {
                                   ShowAll();
                                   ShanChu();
                           }
                           else
                           {
                               alert("删除失败");
                           }
                                                  
                         }               
                       
                       });
                   
                   })
        
               }
        
    });
    
    
    
    
    </script>
    </html>

    delete.php页面

    <?php
    $code=$_POST["code"];
    include("CHaXun.class.php");
    $db=new ChaXun();
    $sql="delete from Info where Code='{$code}'";
    $attr=$db->Query($sql,1);//CHaXun.class.php中默认type=0为查询,这里删除所以type需要更改为1
    if($attr)
    {
    echo
    "ok";
    }

    else
    {
    echo
    "no";
    }
  • 相关阅读:
    vue中局部过滤器的使用
    elementui中switch开关的回调的使用
    css居中的一些方法
    elementui默认样式修改的几种方法
    git查看远程分支,并且切换到远程的分支
    elementui form resetFields方法 无法重置表单
    vue组件使用vuex中的方法报错,报unknown mutation type的错误
    offSet和client和scroll
    842. Split Array into Fibonacci Sequence能否把数列返回成斐波那契数列
    662. Maximum Width of Binary Tree二叉树的最大宽度
  • 原文地址:https://www.cnblogs.com/nannan-0305/p/5502301.html
Copyright © 2020-2023  润新知