Question

这是我第一次在类如下的

上应用jquery ajaxForm

<form class="ajax_form"...><input type="text" name="q" /><input type="submit" /></form>
<form class="ajax_form"...><input type="text" name="q" /><input type="submit" /></form>

<script>
$('.ajax_form').ajaxForm({
  dataType: 'json',
  error: ajaxErrorHandler,
  success: function(response) { // do some ui update .. }
});
</script>

现在Ajax调用完成后我总是进入错误部分虽然firebug没有报告任何错误响应但不确定我做错了什么。

Answer 1

在这种情况下这可能或不合适，但我会提供它，因为当我在寻找类似问题的答案时，它对我有用。如果您在Firefox中提交带有文件上传的“multipart / form-data”表单，jquery.form将使用iframe提交表单。如果您的返回数据的Content-Type是text / plain，则iframe会将结果文本换行为＆lt; pre＆gt;即使Firebug正确显示响应甚至json，也会使jquery json解析器出现问题并给你一个解析器错误的标签。

在我弄明白之前，这让我感到头痛不已（在这个帖子的帮助下： http://www.extjs.com/forum/archive/index.php/t-17248.html）。

我的答案是确保响应Content-Type为“text / html”（这是违反直觉的，至少对我而言）。

Answer 2

@ c.sokun：使用类不应该是一个问题，只要使用该类只有一个表单。在同一页面上具有相同类别的两个表单肯定会导致打嗝（请参阅您的代码......或者这是一个错字？）

您是否尝试过使用 FireBug 并检查传递的参数和返回的值？那应该是第一个！

Answer 3

问题在于你的json数据。这些可能没有很好地形成，无法解析。在这种情况下，不会调用成功函数。

如果您打印错误回调的消息，则可以验证这一点。使用以下代码：

url = url + "?" + $(".ajaxForm").serialize();
$(".ajaxForm").ajax({url: url, dataType: "json", type : "post",
                    success: function(response) {},
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        console.log(textStatus);
                        console.log(errorThrown);
                    }});

其中一个打印输出应该是“解析器错误”。

Answer 4

我认为你需要一个url和post类型的表单来发送数据吗？

这是他们在jquery.com上设置的方式：

$("#myform").ajaxForm({
   url: "mypage.php",
   type: "POST"
 });

Answer 5

ajaxErrorHandler是否在别处定义？我尝试了你的代码，它运行得很好。您使用的是什么版本的jQuery和jQuery表单？

这是我试过的代码。使用名为“test.json”的文件，在与此测试相同的目录中包含“{test：'hello world'}”：

<script type="text/javascript" src="http://malsup.com/jquery/jquery-1.2.6.js"></script>
<script type="text/javascript" src="http://malsup.com/jquery/form/jquery.form.js?2.28"></script>

<form class="ajax_form" action="test.json" method="post"><input type="text" name="q" /><input type="submit" /></form>
<br/>
<form class="ajax_form" action="test.json" method="post"><input type="text" name="q" /><input type="submit" /></form>

<script>
$('.ajax_form').ajaxForm({
  dataType: 'json',
  error: function() {alert("error");},
  success: function(response) {alert(response.test);}
});
</script>

Answer 6

好吧，我已经检查过API并且没有找到任何名为“error”的选项字段的引用，所以可能就是这个原因。检查here。

使用$（'。ajax_form'）的奇怪行为.ajaxForm（）;

6 个答案: