ajax實現(xiàn)從后臺拿數(shù)據(jù)顯示在HTML前端的方法
更新時間：2018年08月20日 17:01:17 作者：韋小龍
今天小編就為大家分享一篇ajax實現(xiàn)從后臺拿數(shù)據(jù)顯示在HTML前端的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
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的標(biāo)簽里顯示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)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
javascript Ajax獲取遠(yuǎn)程url的返回判斷
將以下文本放入一個HTML頁面即可看到效果,將會有兩次彈出提示,最后在頁面上顯示YES,表示完成2012-01-01
下面小編就為大家?guī)硪黄P(guān)于ajax的多次請求問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
有關(guān)Ajax中g(shù)et和post的使用問題
下面小編就為大家?guī)硪黄嘘P(guān)Ajax中g(shù)et和post的使用問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
前段時間在做程序的時候發(fā)現(xiàn)一個小問題，在寫后臺管理上傳圖片時，在我進(jìn)行用Form表單提交的時候直接跳出來提交返回值的頁面并且原先的頁面刷新，下面小編通過分享本文給大家解析下2016-10-10
Ajax讀取txt并對txt內(nèi)容進(jìn)行分頁顯示功能
這篇文章給大家介紹了Ajax讀取txt并對txt內(nèi)容進(jìn)行分頁顯示功能，非常不錯，具有參考借鑒價值，感興趣的朋友一起看看吧2016-11-11
這篇文章主要為大家詳細(xì)介紹了AJAX用于判定用戶是否注冊，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
基于bootstrap的上傳插件fileinput實現(xiàn)ajax異步上傳功能(支持多文件上傳預(yù)覽拖拽)
這篇文章主要介紹了基于bootstrap的上傳插件fileinput 的ajax異步上傳功能(支持多文件上傳預(yù)覽拖拽),非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-03-03
JS AJAX前臺如何給后臺類的函數(shù)傳遞參數(shù)
這篇文章主要介紹了JS AJAX前臺給后臺類的函數(shù)傳遞參數(shù)的方法，下面有個不錯的示例，需要的朋友可以參考下2014-06-06
今天小編就為大家分享一篇快速解決ajax返回值給外部函數(shù)的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
Ajax 的初步實現(xiàn)(使用vscode+node.js+express框架)
這篇文章給大家介紹使用vscode+node.js+express框架操作ajax的初步實現(xiàn)方法，本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友參考下吧2021-06-06