Ajax 加載數(shù)據(jù) 練習代碼
前端與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"; }
主要學了ajax的封裝方法,方法就叫做加載數(shù)據(jù),當要求頁面不刷新的時候,就用這個方法就可以
頁面加載數(shù)據(jù)完成后,要調(diào)一遍
刪除完之后需要再加載一遍,要在調(diào)一遍
Ajax 默認是異步的
異步就是 ajax去調(diào)處理頁面,處理數(shù)據(jù)的時候,代碼繼續(xù)往下走
- 使用Bootstrap Tabs選項卡Ajax加載數(shù)據(jù)實現(xiàn)
- AJAX和jQuery動態(tài)加載數(shù)據(jù)的實現(xiàn)方法
- Javascript vue.js表格分頁,ajax異步加載數(shù)據(jù)
- vue.js 表格分頁ajax 異步加載數(shù)據(jù)
- jQuery Ajax 加載數(shù)據(jù)時異步顯示加載動畫
- Ajax點擊不斷加載數(shù)據(jù)列表
- jQuery結(jié)合AJAX之在頁面滾動時從服務器加載數(shù)據(jù)
- php+ajax實現(xiàn)無刷新動態(tài)加載數(shù)據(jù)技術(shù)
- Ajax動態(tài)加載數(shù)據(jù)庫示例
- jquery Ajax 實現(xiàn)加載數(shù)據(jù)前動畫效果的示例代碼
- 滑輪滾動到頁面底部ajax加載數(shù)據(jù)配合jsonp實現(xiàn)探討
相關(guān)文章
JavaScript中統(tǒng)計Textarea字數(shù)并提示還能輸入的字符
是在文本框中輸入文字的時候,會自動統(tǒng)計輸入的字符,并顯示用戶還能輸入的字符,其實js也可以實現(xiàn),下面就以示例的方式為大家講解下2014-06-06js與jquery分別實現(xiàn)tab標簽頁功能的方法
這篇文章主要介紹了js與jquery分別實現(xiàn)tab標簽頁功能的方法,結(jié)合實例形式對比分析了javascript與jQuery分別實現(xiàn)tab標簽功能的操作技巧,需要的朋友可以參考下2016-11-11不用AI也能實現(xiàn)的文字自動播報(SpeechSynthesis文本實例合成)
SpeechSynthesis是HTML5的一個新特性,基于SpeechSynthesis可以實現(xiàn)在客戶瀏覽器端進行動態(tài)文本的語音合成播放,這篇文章主要介紹了不用AI也能實現(xiàn)的文字自動播報(SpeechSynthesis文本實例合成),需要的朋友可以參考下2023-03-03一文讓你徹底弄懂js中undefined和null的區(qū)別
JavaScript是一門動態(tài)類型語言,元素除了表示存在的空值外,還有可能根本就不存在,這就是undefined存在的原因,這篇文章主要給大家介紹了關(guān)于undefined和null區(qū)別的相關(guān)資料,需要的朋友可以參考下2022-03-03從歷史講起JavaScript基因里的函數(shù)式編程實例
這篇文章主要為大家介紹了從歷史講起JavaScript基因里的函數(shù)式編程實例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-10-10electron實現(xiàn)讀取和寫入配置文件的示例詳解
這篇文章主要介紹了electron實現(xiàn)讀取和寫入配置文件的示例,文中通過代碼示例和圖文結(jié)合的方式介紹的非常詳細,對大家的學習或工作有一定的幫助,需要的朋友可以參考下2024-03-03