以前我们讲的删除是利用嵌入php代码，跳转到另一个页面，从而降低了删除速度，但我们今天讲的利用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> </head> <body> <h1>显示数据</h1> <table width="100%" border="1" cellpadding="0" cellspacing="0"> <tr> <td>代号</td> <td>名称</td> <td>操作</td> </tr> <tbody id="tb"> </tbody> </table> </body> <script type="text/javascript"> //加载数据 load(); //加载数据的方法 function load() { $.ajax({ url:"jiazai.php", datatype:"text", success: function(data){ var str = ""; var hang = data.split("|"); for(var i=0;i<hang.length;i++) { var lie = hang[i].split("^"); str = str+"<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td><input type='button' code='"+lie[0]+"' value='删除' class='sc' /></td></tr>"; } $("#tb").html(str); //删除事件 $(".sc").click(function(){ var code = $(this).attr("code"); $.ajax({ url:"shanchu.php", data:{code:code}, datatype:"text", type:"post", success: function(d){ if(d.trim()=="ok") { alert("删除成功"); load(); } else { alert("删除失败"); } } }); }) } }); } </script> </html>
主页中，ajax引用的加载页面
<?php include("../lzy.class.php"); $db = new lzy(); $sql = "select * from nation"; $arr = $db->query($sql); $str = ""; foreach($arr as $v) { $str = $str.implode("^",$v)."|"; } $str = substr($str,0,strlen($str)-1); echo $str;
效果如下图
接着我们删除处理页面
<?php include("../lzy.class.php"); $db = new lzy(); $code = $_post["code"]; $sql = "delete from nation where code='{$code}'"; if($db->query($sql,0)) { echo "ok"; } else { echo "no"; }
利用ajax做删除就是如此简单啦。。。。
以上就是分享ajax不跳转页面的快速删除操作（可添加美观样式 ）的详细内容。