脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → AJAX相关 → json获取数据库的信息在前端页面显示

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

 更新时间：2018年05月27日 09:43:39   作者：LYF01fang  
今天小编就为大家分享一篇json获取数据库的信息在前端页面显示方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

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

您可能感兴趣的文章:

相关文章

  • ajax使用不同namespace的action的方法

    ajax使用不同namespace的action的方法

    这篇文章主要介绍了ajax 如何使用不同namespace的action,需要的朋友可以参考下
    2014-07-07
  • Ajax实现动态显示并操作表信息的方法

    Ajax实现动态显示并操作表信息的方法

    今天小编就为大家分享一篇Ajax实现动态显示并操作表信息的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • AJAX 验证框架13个

    AJAX 验证框架13个

    众所周知，验证，最好是在客户端尽量解决，以降低服务端资源开销；在目前AJAX流行的今天，基于AJAX的验证更能够为客户端验证提供丰富的机制和美观的交互效果。本文收集了13个比较通用的AJAX验证框架，与大家分享！
    2009-08-08
  • 建立XMLHttpRequest对象

    建立XMLHttpRequest对象

    建立XMLHttpRequest对象...
    2006-07-07
  • ajax实时任务提示功能的实现代码

    ajax实时任务提示功能的实现代码

    本项目运用了 FLEAPHP,MYSQL,SMARTY,FCKEDItor,JSON,PROTOTYPE的技术,在这里首先要感谢这些开源项目的开发者给我们带来的好东西,其次要感谢[生气猪--让我帮她做一个这样的小东西来提醒她按时完成事情].花了一个3个小时完成.希望给大家起到抛砖引玉的作用啊....
    2008-09-09
  • jQuery Ajax的readyState和status的区别和使用详解

    jQuery Ajax的readyState和status的区别和使用详解

    在前几篇分析了jquery的ajax异步和同步，以及异常的一些处理，感觉还没有把ajax的readyState和status说清楚.今天就来说说ajax状态的那点事,非常不错，对ajax readystate和status区别和使用感兴趣的朋友一起学习吧
    2017-03-03
  • 利用ajax传递数组及后台接收的方法详解

    利用ajax传递数组及后台接收的方法详解

    这篇文章主要给大家介绍了关于利用ajax传递数组及后台接收的相关资料，文中介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面跟着小编一起来学习学习吧。
    2017-06-06
  • 基于HTML5 Ajax实现文件上传并显示进度条

    基于HTML5 Ajax实现文件上传并显示进度条

    这篇文章主要介绍了基于HTML5 Ajax实现文件上传并显示进度条的相关资料,需要的朋友可以参考下
    2016-02-02
  • [js]轻便的XMLHttpRequest应用函数：downloadUrl()

    [js]轻便的XMLHttpRequest应用函数：downloadUrl()

    [js]轻便的XMLHttpRequest应用函数：downloadUrl()...
    2007-04-04
  • asp.net+Ajax 文本文件静态分页实现代码

    asp.net+Ajax 文本文件静态分页实现代码

    代码还是很浅显易懂的，呵呵因为我也不会写高深的代码。重要的我们都要动手去实践。菜鸟们多多努力哦。做完我这个例子级会收获很多哦。
    2010-05-05

最新评论