JQuery 无法 post 数据到 SPRING MVC 控制器

JQuery unable to post data to SPRING MVC controller

我正在使用 JQuery 块将 post 数据传送到 Spring 控制器,这里是 JQuery 代码

 $('.usr').click(function () {
        var user = $(this).text();

        $.post("three.htm", {
            user: user
        },function(data){
            console.log(JSON.stringify(data));
            //window.location.replace('five.htm');
            var form = $('<form action="five.htm" method="post">' +
            '<input type="hidden" name="usrData" id="usrData" value="' + JSON.stringify(data) + '" />' +
            '</form>');
            $('body').append(form);
            $("form").submit();
        }); 

 });

并且 spring 控制器中需要来自表单的数据,其代码如下:

@RequestMapping(value="/home/five.htm")
public ModelAndView five(HttpServletRequest request,
        HttpServletResponse response) throws Exception {

    Map<String, String> model = new HashMap<String, String>();
    String abc = request.getParameter("usrData");       
    return new ModelAndView("five",model);
}

"abc" 的值仅被发现为“{”,而我需要的是通过 JQuery.[= 打印到控制台的 JSON 数据的字符串化版本15=]

问题是字符串化 json 数据中 " 的转义。

$('.usr').click(function () {
    var user = $(this).text();

    $.post("three.htm", {
        user: user
    }, function (data) {
        console.log(JSON.stringify(data));
        //window.location.replace('five.htm');
        var $form = $('<form action="five.htm" method="post" />');
        $('<input/>', {
            type: 'hidden',
            name: 'usrData',
            value: JSON.stringify(data)
        }).appendTo($form)
        $('body').append($form);
        $form.submit();
    });

});

例如,如果您的数据是 {test:3},那么您正在构造的字符串将是 <form action="five.htm" method="post"><input type="hidden" name="usrData" id="usrData" value="{"test":3}" /></form>,现在如果您查看 value 属性,您可以看到 " 的值 o 过早终止。


但真的,您需要这样的表单提交吗,为什么不使用简单的 ajax post 请求?

我想这就是问题所在,请尝试删除 value 中的双引号,然后提交表单。

'<input type="hidden" name="usrData" id="usrData" value=' + JSON.stringify(data) + ' />' +

并提交:

form.submit();

最终代码应该是这样的。

     $('.usr').click(function() {
       var user = $(this).text();

       $.post("three.htm", {
         user: user
       }, function(data) {
         console.log(JSON.stringify(data));
         //window.location.replace('five.htm');
         var form = $('<form action="five.htm" method="post">' +
           '<input type="hidden" name="usrData" id="usrData" value=' + JSON.stringify(data) + 
           ' />' +
           '</form>');
         $('body').append(form);
         form.submit();
       });

     });

使用下面的代码问题是 json.stringfy return 中的双引号与结果字符串

$('.usr').click(函数(){ var user = $(this).text();

    $.post("three.htm", {
        user: user
    },function(data){
        console.log(JSON.stringify(data));
        //window.location.replace('five.htm');
        var form = $('<form action="five.htm" method="post">' +
        '<input type="hidden" name="usrData" id="usrData" value=' + JSON.stringify(data) + ' />' +
        '</form>');
        $('body').append(form);
        $("form").submit();
    }); 

});

我建议将 encodeURIComponent 与 JSON.stringify() 一起使用,使用下面的代码片段将 json 设置到输入隐藏字段中,否则在表单仅提交“{”时检查 http header .

示例:

encodeURIComponent(JSON.stringify(data))

服务器端您可以使用一些实用程序代码进行解码以供参考,我在下面提供了 URL 以寻求帮助:

store return json value in input hidden field

解决问题的完整代码:

$(document).ready(function (e) {

    $('.usr').click(function () {
        var user = $(this).text();


        var dgdfg = {
            fname: "chetan",
            lname: "pandya"
        };
        console.log("dgdfg : ");
        console.log(JSON.stringify(dgdfg));
        //window.location.replace('five.htm');
        var form = $('<form action="five.htm" method="post">' +
            '<input type="hidden" name="usrData" id="usrData" value="' + encodeURIComponent(JSON.stringify(dgdfg)) + '" />' +
            '</form>');
        //   $('usrData').attr('value', dgdfg);
        $('body').append(form);
        $("form").submit();


    });

});