亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Ajax 加載數(shù)據(jù) 練習(xí)代碼

??? 2017-01-14 13:35:33 812
????:這篇文章主要介紹了Ajax 加載數(shù)據(jù),主要是為了查詢表的顯示,不用嵌入php通過ajax調(diào)用,現(xiàn)在手機端的更多顯示功能都是通過ajax實現(xiàn)的前端與js代碼<h1>顯示數(shù)據(jù)</h1> <table width="100%" border="1" cellpadding="0"&nb

這篇文章主要介紹了Ajax 加載數(shù)據(jù),主要是為了查詢表的顯示,不用嵌入php通過ajax調(diào)用,現(xiàn)在手機端的更多顯示功能都是通過ajax實現(xiàn)的

前端與js代碼

<h1>顯示數(shù)據(jù)</h1>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
  <tr>
    <td>代號</td>
    <td>姓名</td>
    <td>性別</td>
    <td>民族</td>
    <td>生日</td>
    <td>操作</td>
  </tr> 
  <tbody id="bg">   
  </tbody>
</table>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
   jiazai;
});
 
//加載數(shù)據(jù)的方法
function jiazai
{
  //異步 
  $.ajax({
 url:"jiazai.php",
 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>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[4]+"</td><td><input type='button' value='刪除' class='shanchu' code='"+lie[0]+"' /></td></tr>";
 }
  
 $("#bg").html(str);
  
 $(".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("刪除失敗");
 }
 }
 });
 })
 }
    });
}
</script>

再做個處理頁面jiazai.php

<?php
include("DBDA.class.php");
$db = new DBDA;
$sql = "SELECT * from info";
echo $db->StrQuery($sql);

再做個刪除 shanchu.php

<?php
include("DBDA.class.php");
$db = new DBDA;
$code = $_POST["c"];
$sql = "DELETE from info where code='{$code}'";
if($db->Query($sql,0))
{
  echo "OK";
}
else
{
  echo "NO";
}

主要學(xué)了ajax的封裝方法,方法就叫做加載數(shù)據(jù),當(dāng)要求頁面不刷新的時候,就用這個方法就可以
頁面加載數(shù)據(jù)完成后,要調(diào)一遍
刪除完之后需要再加載一遍,要在調(diào)一遍
Ajax 默認(rèn)是異步的
異步就是 ajax去調(diào)處理頁面,處理數(shù)據(jù)的時候,代碼繼續(xù)往下走

 更多關(guān)于Ajax 加載數(shù)據(jù) 練習(xí)代碼請關(guān)注PHP中文網(wǎng)(ipnx.cn)其他文章!

??? ??

?? ??