ajax动态加载json数据并解析

来源：互联网发布：电脑fm软件编辑：程序博客网时间：2024/05/17 05:10

效果图

这里写图片描述

jsp代码

<form >            姓名：<input name="name" type="text"/>            年龄：<input name="age" type="text"/>            <input type="button" class="get" value="get提交"/>            <input type="button"  class="post" value="post提交"/>            <input type="button" class="ajax" value="ajax提交"/>            </form>            <div id="box"></div>

servlet代码

//getpublic void doGet(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        response.setContentType("text/html");        response.setCharacterEncoding("utf-8");        response.setContentType("text/html;charset=utf-8");        String name = request.getParameter("name");        String age = request.getParameter("age");        if (name == null || name == "") {            name = "测试名字admin";        }        if (age == null || age == "") {            age = "测试年龄100";        }        user user = new user(1, name, age);        PrintWriter out = response.getWriter();        JSONObject jsonObj = JSONObject.fromObject(user);        out.print(jsonObj);        out.flush();        out.close();    }

//postpublic void doPost(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        // response.setContentType("text/html");        request.setCharacterEncoding("utf-8");        response.setCharacterEncoding("utf-8");        response.setContentType("text/html;charset=utf-8");        String name = request.getParameter("name");        if (name == null || name == "") {            name = "测试名字admin";        }        String age = request.getParameter("age");        if (age == null || age == "") {            age = "测试年龄100";        }        user user = new user(1, name, age);        PrintWriter out = response.getWriter();        JSONObject jsonObj = JSONObject.fromObject(user);        out.print(jsonObj);        out.flush();        out.close();    }

JS核心代码

<script type="text/javascript">        //get    $(document).ready(function() {        $('form .get').click(function() {         $.get('ajaxServlet',function(response,status,xhr){             var dataObj = eval("(" + response + ")");             $("#box").html(response);             alert(dataObj.name);        });    });    //post    $('form .post').click(function() {         $.post('ajaxServlet',function(response,status,xhr){             var dataObj = eval("(" + response + ")");             $("#box").html(response);        });    });    //ajax    $('form .ajax').click(function() {        alert($("[name='name']").val());             $.ajax({             type:'get',             url:'ajaxServlet',             data:{             name:$("[name='name']").val(),             age:$("[name='age']").val()             },             success:function(response, status, xhr){             $("#box").html(response);}             });    });    });</script>

0 0