json獲取數(shù)據(jù)庫的信息在前端頁面顯示方法
ajax發(fā)送請求到controller,controller響應(yīng)一個(gè)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)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
ajax判斷后端返回的數(shù)據(jù)是否為null的方法
今天小編就為大家分享一篇ajax判斷后端返回的數(shù)據(jù)是否為null的方法,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08如何利用jQuery post傳遞含特殊字符的數(shù)據(jù)
在jquery中,解決數(shù)據(jù)傳遞處理的方法我們通常利用$.ajax或$.post,但是這里這里通常不能傳遞特殊字符,比如說:“<”,本文就幫大家解決如何傳遞這種含特殊字符的數(shù)據(jù),感興趣的朋友一起看下吧2015-10-10Servlet 與 Ajax 交互一直報(bào)status=parsererror的解決辦法
這篇文章主要介紹了Servlet 與 Ajax 交互一直報(bào)status=parsererror的解決辦法,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03jquery1.8版本使用ajax實(shí)現(xiàn)微信調(diào)用出現(xiàn)的問題分析及解決辦法
這篇文章主要介紹了jquery1.8版本使用ajax實(shí)現(xiàn)微信調(diào)用出現(xiàn)的問題分析及解決辦法的相關(guān)資料,需要的朋友可以參考下2015-11-11history保存列表頁ajax請求的狀態(tài)使用示例詳解
這篇文章主要為大家介紹了history保存列表頁ajax請求的狀態(tài)使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-12-12零基礎(chǔ)學(xué)習(xí)AJAX之AJAX框架
本文是零基礎(chǔ)學(xué)習(xí)AJAX系列教程的第二篇,我們介紹點(diǎn)不一樣的知識,學(xué)習(xí)下ajaxLib和ajaxGold兩款框架,方便我們更好的理解ajax.2015-01-01