json獲取數(shù)據(jù)庫的信息在前端頁面顯示方法
更新時間:2018年05月27日 09:43:39 作者:LYF01fang
今天小編就為大家分享一篇json獲取數(shù)據(jù)庫的信息在前端頁面顯示方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
ajax發(fā)送請求到controller,controller響應一個json格式的數(shù)據(jù)給頁面,
JSON.parse()再解析json字符串,用$.each遍歷。
@RequestMapping("/list")
public @ResponseBody java.util.List<UserVO> List() throws Exception{
return service.get();
}
<body>
<div id="datatable"></div>
</body>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type:"get",
url:"/meihao/login/list.action",
async:true,
success:function(result){
var m="<ul>";
result=JSON.parse(result);
$.each(result, function(i,n) {
console.log(n);
m+="<li>"+"姓名:"+n["username"]+"密碼:"+n["password"]+"</li>";
});
m+="</ul>";
$("#datatable").append(m);
},
error:function(error){
alert(error.status+""+error.statusText);
}
});
});
</script>
以上這篇json獲取數(shù)據(jù)庫的信息在前端頁面顯示方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
ajax判斷后端返回的數(shù)據(jù)是否為null的方法
今天小編就為大家分享一篇ajax判斷后端返回的數(shù)據(jù)是否為null的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
如何利用jQuery post傳遞含特殊字符的數(shù)據(jù)
在jquery中,解決數(shù)據(jù)傳遞處理的方法我們通常利用$.ajax或$.post,但是這里這里通常不能傳遞特殊字符,比如說:“<”,本文就幫大家解決如何傳遞這種含特殊字符的數(shù)據(jù),感興趣的朋友一起看下吧2015-10-10
Servlet 與 Ajax 交互一直報status=parsererror的解決辦法
這篇文章主要介紹了Servlet 與 Ajax 交互一直報status=parsererror的解決辦法,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-03-03
jquery1.8版本使用ajax實現(xiàn)微信調(diào)用出現(xiàn)的問題分析及解決辦法
這篇文章主要介紹了jquery1.8版本使用ajax實現(xiàn)微信調(diào)用出現(xiàn)的問題分析及解決辦法的相關(guān)資料,需要的朋友可以參考下2015-11-11
history保存列表頁ajax請求的狀態(tài)使用示例詳解
這篇文章主要為大家介紹了history保存列表頁ajax請求的狀態(tài)使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-12-12

