Jquery 将HTML表单重定向到Ajax请求

目前我正在测试一些代码，基本上是尝试将HTML表单重定向到AJAX调用（POST），该调用显示服务器上运行的脚本的响应

HTML

<form id='form' name='qform' method='post' action='./resources/comment-redirect.php'>

<input type='search' name='name' class='comment-instance' autofocus='autofocus' value='name' />

<input type='search' name='email' class='comment-instance' autofocus='autofocus' value='email (not published)' />

<TEXTAREA name='comment-box' class='comment-instance' COLS=60 ROWS=5 value='email' />

<button type='submit' id='comment-submit' value='Submit'>--SUBMIT--</button>

</form>

---

所以目前，在控制台窗口中，我得到了“用户点击”，这意味着回调确实有效——但是没有AJAX响应。我使用了浏览器并手动测试了我的PHP脚本，结果也通过了（GET和POST）。所以出于某种原因，这个Ajax调用似乎没有启动

---

任何帮助都将不胜感激。

您在ajax请求中设置了

类型：'POST'

，但在服务器端，您试图从

$\u get

获取发送的数据，因此首先，在

php

代码中，您不需要检查

$\u get

数组，因为您知道，您正在向

$\u POST

阵列发送数据

你有这个

data: {
    'name':$('[name=name]').val().toString(),
    'email':$('[name=email]').val().toString(),
    'comment':$('[name=comment-box]').val().toString()
}

只要去掉

.toString（）

，它就已经是字符串了，即使文本框包含数值，也会被视为字符串

您有

dataType:'json'

，但您没有打印

json字符串

，一个

json字符串

如下所示

'{"key1":"value1","key2":"value2"}'

$('#comment-submit').click(function(e){
    e.preventDefault();
    console.log("User clicked");
    $.ajax({
        type:'POST',
         url:'./resources/comment-redirect.php',
         data:{
             'name':$('[name=name]').val(),
             'email':$('[name=email]').val(),
             'comment':$('[name=comment-box]').val()
         },
         dataType: 'json',
         success: function(result){
              // Will output a JavaScript object (if a json string is returned)
             console.log(result);
         }
     });
});

echo json_encode(array('key1' => 'value1', 'key2' => 'value2'));

console.log(result.msg); // will output "This request has been routed to POST"

因此，您的完整代码（jQuery）应该如下所示

'{"key1":"value1","key2":"value2"}'

$('#comment-submit').click(function(e){
    e.preventDefault();
    console.log("User clicked");
    $.ajax({
        type:'POST',
         url:'./resources/comment-redirect.php',
         data:{
             'name':$('[name=name]').val(),
             'email':$('[name=email]').val(),
             'comment':$('[name=comment-box]').val()
         },
         dataType: 'json',
         success: function(result){
              // Will output a JavaScript object (if a json string is returned)
             console.log(result);
         }
     });
});

echo json_encode(array('key1' => 'value1', 'key2' => 'value2'));

console.log(result.msg); // will output "This request has been routed to POST"

在服务器端，如果不返回（打印）一个

json字符串

，则将

数据类型

更改为

html

或使用类似的方法返回一个有效的

json字符串

'{"key1":"value1","key2":"value2"}'

$('#comment-submit').click(function(e){
    e.preventDefault();
    console.log("User clicked");
    $.ajax({
        type:'POST',
         url:'./resources/comment-redirect.php',
         data:{
             'name':$('[name=name]').val(),
             'email':$('[name=email]').val(),
             'comment':$('[name=comment-box]').val()
         },
         dataType: 'json',
         success: function(result){
              // Will output a JavaScript object (if a json string is returned)
             console.log(result);
         }
     });
});

echo json_encode(array('key1' => 'value1', 'key2' => 'value2'));

console.log(result.msg); // will output "This request has been routed to POST"

因此，在您的

success

回调中，您将得到一个

JavaScript

对象，并且可以像这样使用它

success:function(result){
    console.log(result.key1); // will output value1
    console.log(result.key2); // will output value2
}

如果

url

是正确的，那么它应该可以工作。根据您当前的代码，它可能是

if( !empty($_POST) )
{
    // everything in $_POST array will be encoded as a json string
    echo json_encode($_POST);
}

如果要添加

print("This request has been routed to POST\n");

在您的

json字符串中，您可以尝试以下操作

$_POST['msg'] = 'This request has been routed to POST';
echo json_encode($_POST);

在成功回调中，您可以得到如下字符串（msg）

'{"key1":"value1","key2":"value2"}'

$('#comment-submit').click(function(e){
    e.preventDefault();
    console.log("User clicked");
    $.ajax({
        type:'POST',
         url:'./resources/comment-redirect.php',
         data:{
             'name':$('[name=name]').val(),
             'email':$('[name=email]').val(),
             'comment':$('[name=comment-box]').val()
         },
         dataType: 'json',
         success: function(result){
              // Will output a JavaScript object (if a json string is returned)
             console.log(result);
         }
     });
});

echo json_encode(array('key1' => 'value1', 'key2' => 'value2'));

console.log(result.msg); // will output "This request has been routed to POST"

检查您的控制台，特别是网络选项卡，请求通过了吗？“因此出于某种原因，这个Ajax调用似乎没有启动。”您的意思是不输出console.log（result）？是的，console.log（result）没有给出任何输出。检查“dataType”响应，可能调用了ajax，但数据类型错误@PabloWeb18非常感谢，问题在于最初Ajax调用中的dataType属性。感谢您的建议，我再次查看了JQuery文档以及lo和下面的内容—数据类型是代码期望返回的响应。为了澄清，我使用上面的PHP脚本进行测试—以查看我的请求是否确实是HTTP GET或POST。