网页之间传输的三种方式：TEXT、JSON、XML。

本章将讲解带有TEXT形势的ajax网页传输

第一：body部分代码

<title>ajax中TEXT讲解并且带有删除功能的表格</title>

<script src="jquery-2.0.0.min.js"></script>

<style type="text/css">

.sc

{

	width:70px;

	height:30px;

	background-color:#3FF;

	color:#F00;

	text-align:center;

	line-height:30px;

	vertical-align:middle;

	font-size:20px;

}

.sc:hover

{

	cursor:pointer;

	background-color:#096;

}

</style>

</head>

<body>

<input type="button" value="显示数据" id="btn"/>

<table id="xianshi" width="100%" border="1" cellpadding="0" cellspacing="0">

</table>

</body>

　　

第二：点击“显示数据”需要用到的chuli.php代码

<?php

 include("DBDA.class.php");

 $db=new DBDA();

 $sql="select * from info";

 //自己写语句

 /*$attr=$db->Query($sql);

 $str="";

 foreach($attr as $v)

 {

	 $str=$str.implode("^",$v);

	 $str=$str."|";

 }

 $str=substr($str,0,strlen($str)-1); //截取最后的“|”*/

 //调用封装类里面的函数

 $re=$db->StrQuery($sql);

 echo $re;

　　

AJAX调用返回字符串所引用的StrQuery()函数

//AJAX调用返回字符串

    function StrQuery($sql,$type=0,$ku="mydb")

	{

		$db=new MySQLi($this->host,$this->uid,$this->pwd,$ku);

		!mysqli_connect_error() or die ("连接失败");

		$result=$db->query($sql);

		//当为查询语句时

		if($type==0)

		{

			$attr=$result->fetch_all();

			$str="";

			for($i=0;$i<count($attr);$i++)

			{

				for($j=0;$j<count($attr[$i]);$j++)

				{

					$str=$str.$attr[$i][$j];

					$str=$str."^";

				}

				$str=substr($str,0,strlen($str)-1);

				$str=$str."|";

			}

			$str=substr($str,0,strlen($str)-1);

			return $str;

		}

		//增删改语句

		else

		{

			if($result)

			{

				return "OK";

			}

			else

			{

				return "NO";

			}

		}

	}

　　

第三：JScript中运行的“显示数据”用到的js代码函数

function Showall()

		 {

			 $.ajax({

			 async:false,

			 url:"chuli02.php",

			 dataType:"TEXT",

			 success: function(data){

				 var str="<tr align='center'><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 align='center'><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[4]+"</td><td><div class='sc' bs='"+lie[0]+"'>删除</div></td></tr>";

					 str+="<tr align='center'>";

					for(var j=0;j<lie.length;j++)

					{

						str+="<td>"+lie[j]+"</td>";

					}

					str+="<td><div class='sc' bs='"+lie[0]+"'>删除</div></td>";

					str+="</tr>";

				   }

				   $("#xianshi").html(str);

				 }

			 })

　　

第四：表格中点击“删除”后台运行的代码delete.php

<?php

$code=$_POST["code"];

include("DBDA.class.php");

$db=new DBDA();

$sql="delete from info where code='{$code}'";

$r=$db->Query($sql,1);  //1代表增删改，默认0代表查询

if($r)

{

	echo "OK";

}

else

{

    echo "NO";

}

　　

第五：JScript中“删除”用到的js函数代码

 function BindCK(){

			 $(".sc").click(function(){

				 var code=$(this).attr("bs");

				 $.ajax({

				 url:"delete03.php",

				 data:{code:code},

				 type:"POST",

				 dataType:"TEXT",

				 success:function(data){

					 if(data=="OK"){

						 Showall();

						 BindCK();

						 }

					 else{

						 alert("删除失败！");

						 }

					 }

				 })

				 })

			 }

　　

第六：JScript中两个函数代码整合在一起的调用的代码

     $("#btn").click(function(){

		Showall();

		BindCK();

	 })

　　

ajax中网页传输（一）TEXT——带有删除功能的数据库表格显示练习的更多相关文章

  1. ajax中网页传输（三）XML——下拉列表显示练习

    XML:页面之间传递数据,跨平台传递 HTML:超文本标记语言,核心标签 XML的形势为 <xml version='1.0'> <Nation> <one> &l ...

  2. ajax中网页传输（二）JSON——下拉列表显示练习

    以json返回数据类型显示“民族下拉列表” 第一:body页面显示部分 <title>JSON下拉显示Nation表中的数据</title> <script src=&q ...

  3. jqGrid添加删除功能(不和数据库交互)

    jqGrid添加删除功能(不和数据库交互) 一.背景需求 项目中需要在前端页面动态的添加行,删除行,上下移动行等,同时还不和数据库交互.一直在用jqGrid展示表格的我们,从没有深入的研究过它,当然看 ...

  4. AJAX中的dataType(数据格式)-text、json

    因为经常使用数据格式,所以将它封装成类,J这样就不会用到时就写了,直接调用写好的类就可以了 (1)dataType数据格式为:TEXT格式的数据是字符串的数据,在"ajax对数据进行删除和查 ...

  5. Ajax中的JSON格式与php传输过程的浅析

    在Ajax中的JSON格式与php传输过程中有哪些要注意的小地方呢? 先来看一下简单通用的JSON与php传输数据的代码 HTML文件: <input type="button&quo ...

  6. ajax“显示弹窗详情”和“删除”功能练习

    1.查看详细信息,以弹窗的形式显示,使用ajax 2.批量删除 “查询”功能可以参考前面的文章,这里只讲解ajax“显示弹窗详情”和“删除”功能 第一:在body中的代码 <title>a ...

  7. 使用HTML5中postMessage实现Ajax中的POST跨域问题

    HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...

  8. AJAX 中Sys.WebForms.PageRequestManager的事件激发顺序 《转》

    AJAX 中Sys.WebForms.PageRequestManager的事件激发顺序 测试代码: 测试代码如下: <%@ Page Language="C#" AutoE ...

  9. Mvc音乐商店demo的ajax异步删除功能总结

    刚刚从学校出来参加工作,没啥工作经验,所以各位大神们不要嘲笑哈! 来公司后要进行培训,给我们的作业中有一个使用 dapper+mvc+ajax+SQL Server 2008,来实现一个音乐商店的de ...

随机推荐

  1. angularJS自定义指令间的“沟通”

    由此例子我们可以看出,angularJS使用指令时link的执行顺序<html> <head> <meta charset="utf-8"/> ...

  2. Subset---poj3977（折半枚举+二分查找）

    题目链接:http://poj.org/problem?id=3977 给你n个数,找到一个子集,使得这个子集的和的绝对值是最小的,如果有多种情况,输出子集个数最少的: n<=35,|a[i]| ...

  3. Selenium2学习-022-WebUI自动化实战实例-020-JavaScript 在 Selenium 自动化中的应用实例之二（获取浏览器显示区域大小）

    前几篇文章中简略概述了,如何获取.设置浏览器窗口大小,那么我们该如何获取浏览器显示区域的大小呢?此文讲对此进行简略概述,敬请各位小主参阅.若有不足之处,敬请各位大神指正,不胜感激! 获取浏览器显示区域 ...

  4. angularJs的工具方法

  5. LintCode Subtree

    原题链接在这里:http://www.lintcode.com/en/problem/subtree/ You have two every large binary trees: T1, with ...

  6. 常用jq选择器和遍历的使用

    1.jq的选择器,常用有哪些? class id > ~ ul li a 2.遍历的使用(在使用用遍历节点时,我们的注意遍历在不传递参数(也就是传参),代表的是传递局部全局,也就是"* ...

  7. jQuery对象与DOM对象之间的转换（转）

    什么是jQuery对象? —就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的,其可以使用jQuery里的方法. 比如: $(“#test”).html()   意思 ...

  8. Spring第12篇—— Spring对Hibernate的SessionFactory的集成功能

    由于Spring和Hibernate处于不同的层次,Spring关心的是业务逻辑之间的组合关系,Spring提供了对他们的强大的管理能力, 而Hibernate完成了OR的映射,使开发人员不用再去关心 ...

  9. Linux和Windows路由配置

    Linux和Windows路由配置 一.配置路由 1-       原则上一台主机只能有一条缺省路由.如果一台主机上有多个网段的话,请配置能够上网的那个网段的网关为缺省路由 Linux配置缺省路由: ...

  10. Python线程指南

    本文介绍了Python对于线程的支持,包括“学会”多线程编程需要掌握的基础以及Python两个线程标准库的完整介绍及使用示例. 注意:本文基于Python2.4完成,:如果看到不明白的词汇请记得百度谷 ...