jquery ajax提交json格式的数据,后台接收并显示各个属性

我的表单如下:

<form onsubmit="return false">
            <ul>
                <li><span>用户名</span> <input type='text' placeholder='请输入用户名'
                    name='user'></li>
                <li><span>密码</span> <input type='text' placeholder='请输入密码'
                    name='pwd'></li>
                <li><span>爱好</span> <input type='checkbox' value='bike'>bike
                    <input type='checkbox' value='football'>football <input
                    type='checkbox' name='car'>car</li>
                <li><span>居住地</span> <input type='text' name='address'>
                </li>
                <li><input type='hidden' name='like'></li>
                <li><input type='submit' value='提交' onclick='sub()'></li>
            </ul>
        </form>

提交的数据如下:

function sub() {
        var data = {
            like : []
        };
        $(':checkbox:checked').each(function() {
            data.like.push($(this).val());
        })
        //console.log(data.like);
        $.ajax({
            type:'post',
            url:'list.do',
            dataType : "json",
            data: {data:JSON.stringfy(data)},
            error:function(){
                alert("失败");
            },
            success:function(){
                alert("成功");
            }
        })
    }

后台获取数据:

public void service(ServletRequest req, ServletResponse res)
            throws ServletException, IOException {
        try {
            JSONObject jo = new JSONObject(req.getParameter("data"));
            Iterator it = jo.keys(); // gets all the keys

            while (it.hasNext()) {
                String key = (String) it.next(); // get key
                Object o = jo.get(key); // get value
                System.out.println(key + " : " + o); // print the key and value
            }
        } catch (JSONException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        
    }

参考页面:

http://stackoverflow.com/questions/19568142/how-to-read-json-sent-by-ajax-in-servlet

http://blog.csdn.net/wangxiaohu__/article/details/7254598

原文地址:https://www.cnblogs.com/Non-Tecnology/p/4492774.html