ajax请求接收返回json数据

来源：互联网发布：juniper network mac 编辑：程序博客网时间：2024/05/18 01:22

基础

$.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\"}]");%>

结果：

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

阅读全文

0 0