Question

我目前正在尝试POST提交带有搜索输入的表单，并通过JSON获取结果。所有项目都是一个Web应用程序，可以搜索某些XML文件以获取POST结果。

我的index.html中的表单开头如下：

<form method="post" action="/results">

/ results是以纯文本格式显示JSON结果的页面。

另一方面，在我的脚本中，我试图获得这样的JSON结果：

$("#buttonid").on('click',function(){
    $.ajax({
        url:'/results',
        dataType: 'json',
        type: 'post',
        cache: false,
        success: function(data){
            $(data).each(function(index,value){
                console.log(value);

            });
        }
    });
};

我无法通过控制台查看结果。我能做什么？有什么建议可以解决我的问题吗？

编辑：

不仅仅是一个简单的印刷错误，我解决了在我的表单中删除action="/results"并在ajax选项中添加data: $(this).serialize(),的问题。感谢@foxygen。

Answer 1

正如阿米尔所说，success拼写错误。但是我添加了三件可以帮助你的东西。由于您要POST数据，因此在将选项传递给data函数时，需要将表单数据添加到ajax属性。此外，通常的做法是添加error回调。最后 - 您应该在活动上调用preventDefault，以便页面不会重新加载。

$('form').submit(function(e){

    e.preventDefault();

    $.ajax({
        url:'/results',
        dataType: 'json',
        data: $(this).serialize(),
        type: 'post',
        cache: false,
        success: function(data){

            $(data).each(function(index,value){

                console.log(value);

            });
        },
        error: function(xhr){
            console.log(xhr.responseText);
        }

    });

});

Answer 2

您有拼写错误（success而非succes）：

$("#buttonid").on('click',function(){
    $.ajax({
        url:'/results',
        dataType: 'json',
        type: 'post',
        cache: false,
        success: function(data){
            $(data).each(function(index,value){
                console.log(value);

            });
        }
    });
});

POST后获取JSON结果

2 个答案: