您当前的位置:首页 > 网站建设 > ajax
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax | jQuery | 小程序 |

json获取数据库的信息在前端页面显示方法

51自学网 2022-02-21 10:51:29
  ajax

ajax发送请求到controller,controller响应一个json格式的数据给页面,

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获取数据库的信息在前端页面显示方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持51zixue.net。


下载地址:
利用AjaxSubmit()方法实现Form提交表单后回调功能
ajax上传多图到php服务器的方法
万事OK自学网:51自学网_软件自学网_CAD自学网自学excel、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。