ajax请求接收返回json数据

2017-09-27 19:47:14来源:CSDN作者:for_luo人点击

分享

基础

$.ajax({
url : url, //要提交的URL路径
type : “get”, //发送请求的方式
data : data, //要发送到服务器的数据
dataType : “text”, //指定传输的数据格式
success : function(result) {//请求成功后要执行的代码
},
error : function() { //请求失败后要执行的代码
}
});

代码示例

<script type="text/javascript">     function showStudent() {        $.ajax({            url : 'demoServer.jsp',            data : {age:23},            type : "post",            dataType : "json",            beforeSend : function() {                //alert("发送前");            },            complete : function() {                //alert("完成");            },            success : function(data) {                var mystr = "";                for (var i = 0; i < data.length; i++) {                    mystr += "<tr>";                    mystr += "<td>";                    mystr += data[i].stuid;                    mystr += "</td>";                    mystr += "<td>";                    mystr += data[i].stuname;                    mystr += "</td>";                    mystr += "<td>";                    mystr += data[i].stuage;                    mystr += "</td>";                    mystr += "</tr>";                }                $("#mytable").append(mystr);            },            error : function() {                alert("请求失败");            }        });    }</script></head><body>    <input type="button" value="点击显示学生信息" onclick="showStudent()" />    <table id="mytable" border="1">        <tr>            <td>学号</td>            <td>姓名</td>            <td>年龄</td>        </tr>    </table></body></html>

demoServer.jsp文件中的代码:

<%System.out.println(request.getParameter("age"));    out.print("[{/"stuid/":/"1/",/"stuname/":/"张三/",/"stuage/":/"23/"},{/"stuid/":/"2/",/"stuname/":/"李四/",/"stuage/":/"45/"}]");%>

结果:

未点击前:
这里写图片描述
点击后:
这里写图片描述

最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台