Question

我有一个联系表单，通过标准的JQuery .ajax方法处理谷歌表单，并在成功或失败时重定向到URL。除了在Safari浏览器中（在所有平台上），它在任何地方都能很好地工作我用Google搜索并发现很多人有Safari表单提交问题，但没有一个真正适合这种情况。

除Safari外，所有浏览器/平台都返回200成功状态。而不是成功更换URL，每次使用此浏览器时都会出现404错误。

编辑/附加信息：Safari会删除请求URL中的URL参数，而所有其他浏览器则不会。即：http://example.com而不是http://example.com?thank-you。

这是我的代码，删除了确切的网址和Google表单字段名称。任何有关如何让它在Safari中工作的帮助都表示赞赏。

function postToGoogleForms() {
  var name = $('#Name').val();
  var address = $('#Address').val();
  var city = $('#City').val();
  var state = $('#State').val();
  var zip = $('#Zip').val();
  var email = $('#Email').val();

  $.ajax({
    url: "(Google forms endpoint url here)",
    data: {
      "(Google forms input name here)":name,
      "(Google forms input name here)":address,
      "(Google forms input name here)":city,
      "(Google forms input name here)":state,
      "(Google forms input name here)":zip,
      "(Google forms input name here)":email
    },
    type:"POST",
    dataType:"xml",
    statusCode: {
      0: function () {
        window.location.replace("https://example.com?thank-you");
      },
      200: function () {
        window.location.replace("https://example.com?thank-you");
      }
    }
  });
}
</script>

<form onsubmit="return postToGoogleForms()" method="post">
<input type="text" placeholder="Name" name="Name" id="Name" required>
<input type="text" placeholder="Address" name="Address" id="Address" required>
<input type="text" placeholder="City" name="City" id="City" required>
<input type="text" placeholder="State" name="State" id="State" required>
<input type="text" placeholder="Zip Code" name="Zip" id="Zip" maxlength='10' required>
<input type="email" placeholder="Email" name="Email" id="Email" required>
<button type="submit" value="Submit">Submit</button>
</form>

Answer 1

我修好了。需要明确告知Safari在javascript函数调用onsubmit结束时不重新加载页面。如果你不告诉它，它将在完成该功能后重新加载。所有其他浏览器都比这更聪明。但不是Safari。

所以，我刚刚添加了＆＃39;返回false＆＃39;到功能结束。

使用我的OP中的代码，这就是添加布尔值的样子。

// Blah blah blah other stuff that's unimportant to the answer
$.ajax({
  url: "(Google forms endpoint url here)",
  data: {
    (blah blah blah...)
  },
  type:"POST",
  dataType:"xml",
  statusCode: {
    (blah blah blah...)
  }
});
return false // This is what fixed Safari's handling.
}

表单提交JS / JQuery Ajax调用仅在Safari中失败

1 个答案: