Question

我有这个标记

<form action="..." id="form1" class="foo">...</form>
<form action="..." id="form2" class="foo">...</form>
...

我有这个Javascript代码

$('.foo').ajaxForm({
    dataType: 'json',
    success: function (data) {
       // TODO: How do I get the form that triggered this?
       console.log( $(this) );
    }
});

正如您在Javascript代码中看到的，我希望获取当前的表单元素它提出并且是成功的。输出$(this)没有向我显示任何指向的内容到当前的表单元素。

如何在成功函数中获取当前表单元素？

Answer 1

假设您正在使用jQuery Form Plugin

您可以使用第4个参数

 success: function (data, statusText, xhr,  form ) {

References

success：在提交表单后调用回调函数。如果成功＆＃39;提供回调函数，在从服务器返回响应后调用它。它传递了以下参数：



responseText或responseXML值（取决于dataType选项的值）。

状态文本

xhr（或jQuery包装的表单元素，如果使用jQuery＆lt; 1.4）

jQuery包装的表单元素（如果使用jQuery＆lt; 1.4，则为undefined）

Answer 2

使用：

context将this传递给成功函数

检查以下链接：重复

$.ajax context option

How to pass Object context to jQuery.ajax JSONP callback?

Answer 3

使用beforeSubmit回调：

beforeSubmit: function(arr, $form, options){
    options.context = $form;
}

此处$form是获取ajaxified的当前表单，您可以使用options将上下文添加到当前ajaxForm的{{1}}。所以现在这将保留当前正在提交的表单，您可以获取当前上下文。

类似的东西：

options.context = $form;

Answer 4

您可以将代码更改为：

var fooForm = $('.foo');
fooForm.ajaxForm({
    dataType: 'json',
    success: function (data) {
       // TODO: How do I get t

       console.log( fooForm);
    }
});

你不能得到$（this）因为成功的回调函数，＆＃39;这＆＃39;是指向窗户。

实际上你的代码可以写成这种风格：

var fooForm = $('.foo');
fooForm.ajaxForm({
    dataType: 'json',
    success: successCallback
});
function successCallback(data){
    //'this' point to window : ) 
    console.log( fooForm);

}

希望这会有所帮助。：）

jquery.form.js - 如何在提交时获取当前表单？

4 个答案: