$('form').submit 更改内容长度标头并导致请求失败？答案

【问题标题】：$('form').submit changing content length header and causing request to fail?$('form').submit 更改内容长度标头并导致请求失败？
【发布时间】：2016-11-14 02:06:31
【问题描述】：

失败场景：

我将提交事件绑定到 AJAX 发布请求，以将硬编码的键值对发送到 PHP 脚本，该脚本将返回一条消息，说明请求已正确接收。

提交事件触发并发送 AJAX 请求，但失败。查看 firebug 中的参数，参数看起来与它们应有的完全一样。

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

        $('form').submit(function(event) {
            $.post( "reqhandler.php", { "division": "division"});

        })
    })

工作场景：

我复制 POST 请求并按原样将其输入控制台。请求就像上面一样使用相同的参数执行，但这次它起作用了：

  $.post( "reqhandler.php", { "division": "division"});

我的猜测：

我在上面展示的两个场景之间的唯一区别是请求标头中的内容长度。失败场景的内容长度标头为 23，而工作场景的内容长度标头为 17，这是应该的。

为什么失败的场景不起作用？我不知道如何解决它。

【问题讨论】：

也许为这两个请求发布你的标头？可能与 headers 值有关。
return false; 在您的提交代码中。如果没有成功函数，你怎么知道它失败了？
我知道它失败了，因为我可以在 Firebug 中看到请求的状态，而且我在 Firebug 中检查请求时没有收到任何响应。
@MMhunter 除了内容长度标头之外，请求标头完全相同。 $('form').sumbit 代码导致内容长度标头为 23 而不是 17，我怀疑这会导致脚本失败。
如果表单提交页面重新加载没有event.preventDefault();或return false;。

标签： javascript php http xmlhttprequest

【解决方案1】：

假设您有一个带有提交按钮的表单，请使用以下外部 JavaScript：

$(function(){ //load start

$('form').submit(function(){ // no need for EventObject here
  $.post('reqhandler.php', {division: 'division'}, function(res){
    console.log(res); // use Firebug
    // res could be result from PHP's echo json_encode($assocArray);
  }, 'json');
  return false;
})

}); // load end

reqhandler.php 可能看起来像：

<?php
$res = array('someProp' => 'a value', 'prop2' => array('now', 'you', 'see', 365));
if(isset($_POST['division'])){
  echo json_encode($res);
}
?>

【讨论】：