文章詳情頁
ajax實現(xiàn)從后臺拿數(shù)據(jù)顯示在HTML前端的方法
瀏覽:54日期:2022-06-11 13:11:07
HTML頁面,ajax是基于id的,所有用id表示。
拿到的數(shù)據(jù)會顯示在這里
<div id="test"></div>
ajax源碼:
$(document).ready(function() { $.ajax({ url : "admin/get_online_ganbu.php",//后臺請求的數(shù)據(jù),用的是PHP dataType : "json",//數(shù)據(jù)格式 type : "post",//請求方式 async : false,//是否異步請求 success : function(data) { //如果請求成功,返回數(shù)據(jù)。 var html = ""; for(var i=0;i<data.length;i++){ //遍歷data數(shù)組 var ls = data[i]; html +="<span>測試:"+ls.name+"</span>"; } $("#test").html(html); //在html頁面id=test的標簽里顯示html內(nèi)容 }, }) })
php源碼:
<?php include "conn.php";//這是鏈接數(shù)據(jù)的。 $result = mysql_query("SELECT * FROM online where class =1 "); $dataarr = array(); while($row = mysql_fetch_array($result)){ array_push($dataarr, $row); } mysql_close($con); echo json_encode($dataarr); ?>
以上這篇ajax實現(xiàn)從后臺拿數(shù)據(jù)顯示在HTML前端的方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持。
標簽:
Ajax
相關(guān)文章:
1. Ajax提交post請求案例分析2. AJAX實現(xiàn)文件上傳功能報錯Current request is not a multipart request詳解3. Ajax實現(xiàn)文件上傳功能(Spring MVC)4. 利用ajax+php實現(xiàn)商品價格計算5. 如何封裝一個Ajax函數(shù)6. 使用FormData進行Ajax請求上傳文件的實例代碼7. axios和ajax的區(qū)別點總結(jié)8. AJAX的跨域問題解決方案9. Python數(shù)據(jù)可視化實現(xiàn)多種圖例代碼詳解10. 告別AJAX實現(xiàn)無刷新提交表單
排行榜
