Ajax 成功事件不起作用

【问题标题】：Ajax success event not workingAjax 成功事件不起作用
【发布时间】：2010-12-30 11:32:15
【问题描述】：

我有一个注册表，正在使用$.ajax 提交。

这是我的 AJAX 请求：

$(document).ready(function() {
    $("form#regist").submit(function() {
        var str = $("#regist").serialize();
        $.ajax({
            type: 'POST',
            url: 'submit1.php',
            data: $("#regist").serialize(),
            dataType: 'json',
            success: function() {
                $("#loading").append("<h2>you are here</h2>");
            }        
        });
        return false;        
    });
});

在我的submit1.php 文件中，我检查数据库中是否存在电子邮件地址 和用户名 字段。 如果这些值存在 没有页面刷新，我希望显示一条错误消息。

如何将它添加到我的 AJAX 请求的 success 回调中？

【问题讨论】：

  • 你确定调用了成功回调吗？
  • 您需要针对第二个问题提出一个新问题。

标签： javascript jquery ajax


【解决方案1】：

结果可能不是 JSON 格式，所以当 jQuery 尝试解析它时，它会失败。您可以使用error: 回调函数捕获错误。

无论如何，您似乎不需要在该函数中使用 JSON，因此您也可以取出 dataType: 'json' 行。

【讨论】：

  • 我将数据类型更改为文本并使其正常工作。像这样dataType:'text'
  • +1 甚至是我的，但在不是我的代码上，我通过从服务器返回 json 数据来解决
  • 如果没有指定dataType:，但url: 以.json 结尾，也会发生这种情况。
  • 同样在$.post 别名中提供json 作为没有来自服务器的实际json 的数据类型不会触发success 回调
  • 如果你想发出一个 json ajax 请求，请确保它的 mime-type 设置为 application/json。这给我带来了一些麻烦。
【解决方案2】：

虽然问题已经解决了，但我还是添加了这个，希望它可以帮助其他人。

我犯了一个错误，试图直接使用这样的函数（成功：OnSuccess(productID)）。但是你必须先传递一个匿名函数：

  function callWebService(cartObject) {

    $.ajax({
      type: "POST",
      url: "http://localhost/AspNetWebService.asmx/YourMethodName",
      data: cartObject,
      contentType: "application/x-www-form-urlencoded",
      dataType: "html",
      success: function () {
        OnSuccess(cartObject.productID)
      },
      error: function () {
        OnError(cartObject.productID)
      },
      complete: function () {
        // Handle the complete event
        alert("ajax completed " + cartObject.productID);
      }
    });  // end Ajax        
    return false;
  }

如果您不使用匿名函数作为包装器，即使 Web 服务返回异常也会调用 OnSuccess。

【讨论】：

  • 这与 ajax、jquery 和处理程序无关。我们也可以有一条评论提醒“整个代码应该被包装在一个脚本标签中”。解释是错误的：你不必在匿名函数中包装任何东西，命名函数就可以了，只要你传递它而不是调用它。此外，它还具有误导性：在请求发送之前就调用了 OnSuccess，因此将其与返回任何内容的 Web 服务联系起来是没有意义的。
  • 这个答案对我有帮助，但我没有投票，你应该根据@fdreger 评论更新你的答案。
【解决方案3】：

我尝试删除 dataType 行，但它对我不起作用。我通过使用“完成”而不是“成功”作为回调解决了这个问题。成功回调在 IE 中仍然失败，但由于我的脚本运行并完成，这就是我所关心的。

$.ajax({
    type: 'POST',
    url: 'somescript.php',
    data: someData,
    complete: function(jqXHR) {
       if(jqXHR.readyState === 4) {
          ... run some code ... 
       }   
    }        
 });

在 jQuery 1.5 中你也可以这样做。

var ajax = $.ajax({
    type: 'POST',
    url: 'somescript.php',
    data: 'someData'
});
ajax.complete(function(jqXHR){
    if(jqXHR.readyState === 4) {
        ... run some code ... 
    }
});

【讨论】：

  • 请注意。无论 ajax 调用是否成功，complete 都会被调用，而 success 仅在 Web 服务器响应 200 OK HTTP 标头（一切正常）时才会被调用。
【解决方案4】：

在您的 PHP 文件中生成 JSON 格式的数据之前，请确保您没有打印（回显或打印）任何文本/数据。这可以解释你得到一个-sucessfull 200 OK-但是你的成功事件在你的javascript中仍然失败。您可以通过检查 POST submit1.php 的 firebug 中的“网络 - 回答”部分来验证您的脚本正在接收什么。

【讨论】：

  • 这真的帮助了我。我知道这是一个旧答案，但这正是我一直遇到的问题。在调试过程中使用 echo's 或 print_r's 并找出这些实际上导致了错误... :) 谢谢！
  • 6 年后，仍然帮助人们解决这个问题！否则我不知道该往哪里看。
【解决方案5】：

在您的 success 回调中添加一个 alert() 以确保它被调用。

如果不是，那只是因为请求根本不成功，即使您设法访问了服务器。合理的原因可能是超时过期，或者您的 php 代码中的某些内容引发了异常。

为 firefox 安装 firebug 插件（如果尚未安装）并检查 AJAX 回调。您将能够看到响应，以及它是否收到成功的 (200 OK) 响应。您还可以在complete 回调中添加另一个alert()，绝对应该调用它。

【讨论】：

  • 感谢您的回复。尝试在成功事件中发出警报，但它不起作用。我有firefox的firebug插件，它确实收到了成功的（200 OK）响应，所以没有问题。我在我的php文件中调用了一个die函数来检查任何错误，当我在firebug中检查它时，它显示了正确的响应。 “您还可以在完整的回调中放置另一个警报（），绝对应该调用它。”是什么意思？？非常感谢您的快速回复
  • 如果您在success 中没有看到警报，则说明不成功。由于响应为 200 OK，因此 Tatu 的回复似乎是合理的，但为了进一步排除故障，您可以使用另一个名为 complete 的事件，无论请求是否成功（success 仅在请求时才会发生成功）。 complete: function (xhr, status) { alert('complete: '+status); }
【解决方案6】：

我返回了有效的 JSON，在我的“完成”回调中得到了 200 的响应，并且可以在 chrome 网络控制台中看到它......但我没有指定

dataType: "json"

一旦我这样做了，与“接受的答案”不同，它实际上解决了问题。

【讨论】：

    【解决方案7】：

    我有同样的问题。发生这种情况是因为 javascript 期望 json 返回数据中的数据类型。但是如果您在 php 中使用 echo 或 print，就会出现这种情况。如果您在php 中使用echo 函数返回数据，只需删除dataType : "json" 工作得很好。

    【讨论】：

      【解决方案8】：

      您必须同时声明成功和错误回调。添加

      error: function(err) {...}

      应该解决问题

      【讨论】：

        【解决方案9】：

        我正在使用 XML 将结果从服务器上的 php 传回网页，我也有同样的行为。

        在我的情况下，原因是结束标签与开始标签不匹配。

        <?php
....
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>
    <result>
        <status>$status</status>
        <OPENING_TAG>$message</CLOSING_TAG>
    </result>";
?>

        【讨论】：

          【解决方案10】：

          我在使用 ajax 函数从 Magento 恢复用户密码时遇到了这个问题。成功事件没有被触发，然后我意识到有两个错误：

          1. 结果未以 JSON 格式返回
          2. 我试图将数组转换为 JSON 格式，但该数组包含非 utf 字符

          因此，每次我尝试使用 json_eoncde() 对返回的数组进行编码时，该函数都无法正常工作，因为它的索引之一包含非 utf 字符，其中大部分是巴西葡萄牙语单词的重读。

          【讨论】：

            【解决方案11】：

            我试图从控制器返回字符串，但为什么控制返回错误块没有成功的 ajax

            var sownum="aa";
$.ajax({
    type : "POST",
    contentType : 'application/json; charset=utf-8',
    dataType : "JSON",
    url : 'updateSowDetails.html?sownum=' + sownum,
    success : function() {
        alert("Wrong username");
    },
    error : function(request, status, error) {

        var val = request.responseText;
        alert("error"+val);
    }
});

            【讨论】：

              【解决方案12】：

              我在查询不返回成功响应的控制器时遇到了同样的问题，当修改我的控制器以返回成功消息时问题得到了解决。 注意使用 Lavalite 框架。 之前：

              public function Activity($id)
    {
        $data=getData();
        return
            $this->response->title('title')
                ->layout('layout')
                ->data(compact('data'))
                ->view('view')
                ->output();
    }
after code looks like:
    try {
            $attributes = $request->all();
            //do something
            return $this->response->message('')
                ->code(204)
                ->status('success')
                ->url('url'. $data->id)
                ->redirect();
        } catch (Exception $e) {
            return $this->response->message($e->getMessage())
                ->code(400)
                ->status('error')
                ->url('nothing Wrong')
                ->redirect()
        }

              这对我有用

              【讨论】：

                【解决方案13】：

                我遇到了同样的问题，我以这种方式解决了它： 我的阿贾克斯：

                event.preventDefault();
$.ajax('file.php', {
method: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({tab}), 
success: function(php_response){
            if (php_response == 'item') 
                {
                    console.log('it works');
                }
            }
        })

                好的。问题不在于 json，而在于 php 响应。 之前：我的 php 响应是：

                echo 'item';

                现在：

                $variable = 'item';
 echo json.encode($variable);

                现在我成功了。 PS。对不起，如果有什么问题，但这是我在这个论坛上的第一条评论:)

                【讨论】：

                  【解决方案14】：

                  在我的情况下，错误是在服务器端，因此它返回了一个 html

                  wp_nonce_field(basename(__FILE__), "mu-meta-box-nonce");

                  【讨论】：

                    【解决方案15】：

                    以这种方式添加“错误”回调（就像“成功”一样）：

                    $.ajax({
   type: 'POST',
   url: 'submit1.php',
   data: $("#regist").serialize(),
   dataType: 'json',
   success: function() {
      $("#loading").append("<h2>you are here</h2>");
   },
   error: function(jqXhr, textStatus, errorMessage){
      console.log("Error: ", errorMessage);
   }
});

                    所以，就我而言，我在控制台中看到：

                    Error:  SyntaxError: Unexpected end of JSON input
  at parse (<anonymous>), ..., etc.

                    【讨论】：

                      【解决方案16】：

                      success callback 有两个参数：

                      success: function (data, textStatus) { }

                      还要确保 submit1.php 设置正确的内容类型标头：application/json

                      【讨论】：

                      • 感谢您的回复。我在 jquery ajax documentaion 上读到了这个，但我无法弄清楚我下一步应该做什么才能让它工作......如果你能指出我正确的方向，我将不胜感激。这是否也意味着我的 php 文件中应该有一些特定的代码？非常感谢
                      • success 接受两个参数这一事实似乎与问题完全无关。您可以将任意数量的参数传递给 javascript 函数，无论它在其声明中接受多少参数，所以这绝对不是这些问题的原因，并且因为没有值 data 或 textStatus 在成功回调，似乎根本没有充分的理由在函数中声明它们。
                      • 并且 JSON 数据不必具有正确的内容类型标头，它只需为 JSON 格式即可。
                      猜你喜欢
                      • 1970-01-01
                      • 1970-01-01
                      • 1970-01-01
                      • 1970-01-01
                      • 2015-11-10
                      • 2014-01-31
                      • 1970-01-01
                      • 1970-01-01
                      • 1970-01-01
                      相关资源
                      最近更新 更多
                      热门标签
                      Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode