網頁之間傳輸的三種方式: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%" 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();
})
轉載于:https://www.cnblogs.com/zst062102/p/5510395.html