1.遍历ajax返回的json:

  第一种:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'login.jsp' starting page</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>

<script type="text/javascript">
    $(function() {
        $("#do_login_button").click(function() {
            $.ajax({
                type : "POST",
          data :{
            username: $("#username").val(),
            password: $("#password").val()
          },
url :
"login/findUser", dataType : "json", success : function(data) { var dataObj = data, //返回的result为json格式的数据 con = ""; $.each(dataObj, function(index, item){ con += "<li>姓名:"+item.username+"</li>"; con += "<li>性别:"+item.password+"</li>"; con += "<li>现居地:"+item.id+"</li>"; }); console.log(con); //可以在控制台打印一下看看,这是拼起来的标签和数据 $("#con").html(con); //把内容入到这个div中即完成 } }); }); }); </script> </head> <body> <form id="forms" method="post"> Username:<input type="text" >input type="password" >input id="do_login_button" type="button" value="Login" /> </form> <div id="box"> <a class="btn" href="javascript:;">点击</a> <ul id="con"></ul> </div> </body> </html>

 

2.Ajax:

 

分类:

技术点:

相关文章: