以前我们讲的删除是利用嵌入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不跳转页面的快速删除操作,可添加美观样式的更多相关文章

  1. @Ajax.ActionLink跳转页面的问题解决方案 MVC Ajax不支持问题

    [JavaScriptResult]在客户端执行服务器返回的JavaScript代码当一个内置的Ajax辅助方法请求一个操作方法,该方法会返回一个在客户端执行立即的脚本. public ActionR ...

  2. ajax无法跳转页面的问题,

    将return true去掉!

  3. ajax删除数据(不跳转页面)

    以前我们讲的删除是利用嵌入php代码,跳转到另一个页面,从而降低了删除速度,但我们今天讲的利用ajax不仅可以达到不跳页面快速删除,并且能添加特效来美化页面. AJAX = 异步 JavaScript ...

  4. js通过生成临时表单再删除的方式向后台提交数据(模拟ajax的post提交但还要跳转页面不返回数据)以及 struts向前台返回文件下载及防止中文乱码处理

    为了避免发送数据中有特殊字符,发送时用 encodeURIComponent 编码 (其实这个 if中是直接通过浏览器下载文件的方法,else是向后台传数据的方法) struts后台Action处理接 ...

  5. dedecms如何快速删除跳转的文章(记得清空内容回收站)

    网站内容更新多了,有些页面修改了,这时其他相关页面也要做相应的调整,不然可能会出现404错误,那么dedecms如何快速删除跳转的文章呢?下面就随ytkah一起操作一下吧 如上图所示,在“核心”(标示 ...

  6. 杂记-格式化Date默认格式,日期加一天,jstl判断字符类型,ajax模拟from表单后台跳转页面,jstl访问数据库并在页面显示

    1.格式化Date默认格式 String str="Sun Oct 08 22:36:45 CST 2017"; SimpleDateFormat sdf = new Simple ...

  7. 页面中的删除确认(ajax)、输入框中确认信息是否可用(ajax)的jquery代码

    1.页面中的删除确认(ajax) <%@ page language="java" contentType="text/html; charset=UTF-8&qu ...

  8. 用jQuery.ajaxWebService请求WebMethod,Ajax处理实现局部刷新;及Jquery传参数,并跳转页面 用post传过长参数

    首先在aspx.cs文件里建一个公开的静态方法,然后加上WebMethod属性. 如: [WebMethod]  public static string GetUserName()   {  //. ...

  9. 【坑】前端使用ajax异步请求以后,springMvc拦截器跳转页面无效

    文章目录 前言 `$.ajaxSetup( )` 后记 前言 本文着重解决前后端分离开发的页面调整问题. 笔者,在做一个需求,需要对访问网站,但是没有登录的用户进行拦截,将他们重定向到首页. 很简单的 ...

随机推荐

  1. 分块试水--CODEVS5037 线段树练习4加强版

    感觉这才算入门题吧..前面那些线段树练习,改几个字符就过了一定要搞成几道题.. n<=2e5的数列,给常数K<=2e5,m<=2e5个操作,区间加,问一个区间里K的倍数. 这题空间? ...

  2. 51 nod 1079 中国剩余定理

    1079 中国剩余定理 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题  收藏  关注 一个正整数K,给出K Mod 一些质数的结果,求符合条件的最小的K.例如,K % ...

  3. mysql limit具体用法

    MYSQL中LIMIT用法_百度知道 答 limit是mysql的语法select * from table limit m,n其中m是指记录开始的index,从0开始,表示第一条记录n是指从第m+1 ...

  4. CI session 类的用法

    最近使用codeingiter框架,发现默认的session 不是很好用,以下是用法总结:使用的是2.0.2的版本 1.扩展自带的session类:application/libraries/MY_s ...

  5. HDU 1853 Cyclic Tour(最小费用最大流)

    Cyclic Tour Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/65535 K (Java/Others) Tota ...

  6. 百度LBS云搜索时报错 &quot;filter:area is not filteable field, please set property in the cloud-storage

    {"status":2,"message":"filter:area is not filteable field, please set prope ...

  7. 分布式消息服务DMS如何实现死信消息的消费

    本文部分内容节选自华为云帮助中心的分布式消息服务(DMS)服务的产品介绍 死信消息是什么 死信消息是指无法被正常消费的消息.分布式消息服务DMS支持对消息进行异常处理.当消息进行多次重复消费仍然失败后 ...

  8. ocpm

    学习中心 | 腾讯社交广告营销平台 http://e.qq.com/ads/learning/data/optimization/case/035/

  9. ROADS - Roads

    N cities named with numbers 1 ... N are connected with one-way roads. Each road has two parameters a ...

  10. XAML实例教程系列 - 依赖属性和附加属性(四)

    XAML实例教程系列 - 依赖属性和附加属性 2012-06-07 13:11 by jv9, 1479 阅读, 5 评论, 收藏, 编辑 微软发布Visual Studio 2012 RC和Wind ...