zoukankan      html  css  js  c++  java
  • ajax 小练习

    <!DOCTYPE html>
    <html lang="zh-cn">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta name="renderer" content="webkit">
        <title>网站信息</title>  
        <link rel="stylesheet" href="../css/pintuer.css">
        <link rel="stylesheet" href="../css/admin.css">
        <script src="../js/jquery.js"></script>
        <script src="../js/pintuer.js"></script>  
    </head>
    <body>
        <?php
        session_start();
         if(empty($_SESSION["uid"]))
         {
             header("location:../login.html");
            exit;
            
         }
        ?>
    <div class="panel admin-panel">
      
     <table width="100%" border="1" cellpadding="0" cellspacing="0" style="text-align:center">
        <tr>
            <td>栏目</td>
            
            <td>编辑</td>
            <td>删除</td>
            
        </tr>
        
        <tbody id="bg">
            
        </tbody>
    
    </table>
    </div>
    <br>
    <div><input type="button" value="添加栏目" id="add"/></div>
    <div class="add" >栏目名称:<input type="text" id="lm"/></div>
    <div class="add" >类型:<input type="text" id="lx"/></div>
    
    <div class="add" ><input type="button" value="添加" id="tianjia"/></div>
     <script type="text/javascript">
    $(document).ready(function(e) {
        
         jiazai();
                        
            
                            
        
                            //添加栏目
                        
                        
                        $("#tianjia").click(function(){
                                    
                            var lm = $("#lm").val(),
                                lx=$("#lx").val(),
                                xh=$("#xh").val();
                    
                            $.ajax({
                                url:"add.php",
                                data:{lm:lm,lx:lx,xh:xh},
                                type:"POST",
                                dataType:"TEXT",
                                success:function(jia){
                                        if(jia.trim()=="OK")
                                        {
                                            //重新加载
                                            jiazai();
                            
                                        }
                                        else
                                        {
                                            alert("添加失败");
                                        }
                                    }
                                });
                            
                        })
    
    
    function jiazai()
    {
                    
            //调AJAX
            $.ajax({
                    url:"lanmuchuli_hou.php",
                    type:"POST",
                    dataType:"TEXT",
                    success: function(data){ 
                            var hang = data.split("|");
                            var str="";
                        
                        for(var i=0;i<hang.length;i++)
                        
                            {    
                                var lie = hang[i].split("^");
                            
                                
                                str += "<tr><td class='n'>"+lie[0]+"</td><td><input type='button' value='修改' class='xiugai' code='"+lie[2]+"' /></td><td><input type='button' value='删除' class='shanchu' code='"+lie[2]+"' onclick='return del(1)' /></td></tr>";
                                
                            }
                        $("#bg").html(str);
                        xiugai();//调用修改栏目方法    
                        //删除栏目    
                        $(".shanchu").click(function(){
                            
                            var code = $(this).attr("code");
                            $.ajax({
                                url:"shanchu.php",
                                data:{c:code},
                                type:"POST",
                                dataType:"TEXT",
                                success: function(d){
                                        if(d.trim()=="OK")
                                        {
                                            //重新加载
                                            jiazai();
                                        }
                                        else
                                        {
                                            alert("删除失败");
                                        }
                                    }
                                });
                        })
                            
                            
                            
                            
                            
                        
                            
                        
                        }
                });
    }
    
    
    
        //修改栏目
                    function xiugai(){
                    $(".xiugai").click(function(){
                        
                    var code = $(this).attr("code");
                                    
            $.ajax({
                type:"post",
                url:"lanmuchuli_xiugai.php",
                data:{code:code},
                dataType:"TEXT",
                success:function(r){
                    $("#bg").html(r);
    
                    
                    $("#lanmu_xiugai").click(function(){
                        var name = $("#lanmu_name").val();
                        $.ajax({
                            type:"post",
                            url:"xiugai.php",
                            data:{code:code,name:name},
                            success:function(j){
                                jiazai();
                            }
                        });                    
                        
                    })
                        
                }
            });
            
                                
                                    
                                    
                                    
                            
                            
                                })
                            
            }
    
    
    })
    
    
    
    </script>
    </body>
     
    </html>
    处理界面:
    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $sql = " select * from lanmu ";
    $attr = $db->StrQuery($sql);
    echo $attr;
    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $lm = $_POST["lm"];
    $lx = $_POST["lx"];
    
    $sql = "insert  into lanmu values('{$lm}','{$lx}','','xiugai')";
    $r=$db->Query($sql,0);
    if($r)
    {
        echo "OK";
    }
    else
    {
        echo "NO";
    }
    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $code = $_POST["c"];
    $sql = "delete from lanmu where code='{$code}'";
    $r = $db->Query($sql,0);
    if($r)
    {
        echo "OK";
    }
    else
    {
        echo "NO";
    }
    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $sql = "select * from lanmu";
    $code=$_POST["code"];
    $at = $db->Query($sql);
    $str = "";                        
    foreach($at as $v)
    {
        if($v[2]==$code)
        {
            $str.="<tr><td class='n'><input type='text' id='lanmu_name' value='{$v[0]}'></td><td><input type='button' value='保存' id='lanmu_xiugai' code='{$v[2]}' /></td><td></td></tr>";
        }
        else
        {
            $str.="<tr><td class='n'>{$v[0]}</td><td><input type='button' value='修改' class='xiugai' code='{$v[2]}' /></td><td><input type='button' value='删除' class='shanchu' code='{$v[2]}' /></td></tr>";
        }
        
    }
    echo $str;            
    ?>
    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $code=$_POST["code"];
    $name=$_POST["name"];
    $sql = " update lanmu set name='{$name}' where code={$code}";
    $db->Query($sql,0);
    ?>

    删除功能:

    添加功能:

     

    修改功能:

  • 相关阅读:
    Jdbc 事务
    Spring
    【Java集合的详细研究1】Collections类常用方法总结
    Java Number类
    Java中值类型和引用类型的区别
    Java常量池的理解
    Java重写与重载之间的区别
    Java中Animal b = new Dog();Dog c = new Dog();的区别
    java类构造器的理解
    Javascript history pushState onpopstate方法做AJAX SEO
  • 原文地址:https://www.cnblogs.com/F4natasy/p/6655809.html
Copyright © 2011-2022 走看看