JSON成功后重定向到其他地方？答案

【问题标题】：Redirect somewhere else upon JSON success?JSON成功后重定向到其他地方？
【发布时间】：2017-11-19 06:08:50
【问题描述】：

我的代码：

<script>
  $('#form').submit(function() {
    $.ajax({
      type: 'POST',
      url: $(this).attr('action'),
      dataType: 'json',
      success: function(json) {
        window.location.href = "http://www.example.com";
      }
    });
    return false;
  });
</script>

表格：

<form id="form" class="center" action="http://localhost/products/index.php?route=checkout/cart/add" method="post">
  <input type="text" name="cname">
  <input type="hidden" name="product_id" value="51">
  <input type="submit">
</form>

当表单按下提交时，它会进入操作页面，这只是一条 JSON 成功消息，我想要做的是重定向到操作页面以外的其他页面，但我的代码似乎不起作用？

我的代码到底有什么问题，有人可以帮我解决吗？

如果您能帮助我，我将不胜感激，非常感谢！

【问题讨论】：

标签： javascript jquery html json forms

【解决方案1】：

您没有发布任何使 POST 相当无用的数据。

你也没有错误处理程序

试试：

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

       var $form = $(this);

        $.ajax({
            type: 'POST',
            url: $form.attr('action'),

            // data to send
            data: $form.serialize(),

            dataType: 'json',
            success: function(json) {
               window.location.href = "http://www.example.com";
            },
            error: function(){
               // do something when request fails - See $.ajax docs
            }
        })
        return false;
    });
});

【讨论】：

只要我提交表单，它就会将我带到localhost/products/index.php?route=checkout/cart/add的 JSON 响应
即使有这段代码，我也添加了一个错误函数去不同的位置，但似乎完全忽略了代码
可能在页面中存在表单之前调用它。确保包含$(function(){ /* code here */})
什么意思？
如果该代码在 html 中的表单元素之上...当代码运行时表单将不存在。无法向尚不存在的事物添加事件监听器

【解决方案2】：

您可以使用此代码进行错误处理！您还可以在 stackOverflow 上检查此问题，以使用 jQuery/JavaScript 重定向到另一个页面： click here

$('#form').submit(function() {
  var $form = $(this);
  $.ajax({
    type: 'POST',
    url: $form.attr('action'),

    // data to send
    data: $form.serialize(),
    dataType: 'json',
    success: function(json) {
      window.location.href = "http://www.example.com";
    },
    error: function (jqXHR, exception) {
      var msg = '';
      if (jqXHR.status === 0) {
        msg = 'Not connect.\n Verify Network.';
      } else if (jqXHR.status == 404) {
        msg = 'Requested page not found. [404]';
      } else if (jqXHR.status == 500) {
        msg = 'Internal Server Error [500].';
      } else if (exception === 'parsererror') {
        msg = 'Requested JSON parse failed.';
      } else if (exception === 'timeout') {
        msg = 'Time out error.';
      } else if (exception === 'abort') {
        msg = 'Ajax request aborted.';
      } else {
        msg = 'Uncaught Error.\n' + jqXHR.responseText;
      }
      alert(msg);
    },
  });
});

【讨论】：

【解决方案3】：

您需要有单独的错误和成功处理程序，如下所示。在成功方法中，您可以重定向到其他页面/站点 (window.location.href = "http://www.EXAMPLE.com";)

var ajaxUpdateRequest = {
url: '/dotnethelpers/UpdateUsers',
dataType: 'json',
success: updateSuccessfully, //Separate method for handling success
error: showError //Separate method for handling error
};

【讨论】：