Question

我正在使用Gravity Forms，并希望在onclick之后将其提交按钮文本更改为“处理...”。 Gravity Forms告诉我在heading.php文件中使用一些自定义的javascript来实现这一点。给出了以下脚本（http://stackoverflow.com/questions/1071012/using-jquery-to-change-input-button-text-back-after-a-few-seconds）此链接指向正确的方向但我还在学习，需要一些帮助！有人可以帮我破解这段代码吗？

$("form.stock").submit(function()
{
    var $form = $(this);
    $.post( $form.attr('action'), { id: '123', stock: '1' } );
    var $submit = $form.find(":submit").attr('value','Saved!');
    window.setTimeout(function()
    {
        $submit.attr('value','Update') 
    }, 2000);
    return false;
});

什么是form.stock指的是什么？并且：'123'股票：'1'指的是？

最后，（这个）做了什么？ - var $form = $(this);

我很感激你的善意 - 我知道这些是我应该知道的一些基本问题！

Answer 1

$("form.stock") // <-- this finds forms with class=stock
    .submit(function() { // <-- binds submit handler to them
    var $form = $(this);  //<-- this caches current form that's triggered event handler
       // ajax post to the current form's action attribute
       $.post($form.attr('action'), {
           id: '123',  // <-- these are the data passed back to your server
           stock: '1'
       });
       //  find's submit button and changes value to 'Saved!'
       var $submit = $form.find(":submit").attr('value', 'Saved!');
       window.setTimeout(function() {
           // after 2000ms update value back to 'Update'
           $submit.attr('value', 'Update')
       }, 2000);          
       return false; // <-- stops any event bubbling and default action of form submit
});

虽然你真的应该在成功函数内部进行文本更改。这样只有帖子成功，它才会改变。

$("form.stock").submit(function() { 
    var $form = $(this);            
       $.post($form.attr('action'), function(){ 
          // these are now in the success function.. so these will only occur if ajax is successful
          var $submit = $form.find(":submit").attr('value', 'Saved!');
          window.setTimeout(function() {
              // after 2000ms update value back to 'Update'
              $submit.attr('value', 'Update')
          }, 2000);
       });        
    return false; // <-- stops any event bubbling and default action of form submit
});

Answer 2

什么是form.stock指的是

<form>元素，class=stock作为jQuery选择器。如果你有：

<form class="stock">

在您的HTML中，$("form.stock")选择它。 .submit将函数绑定到“submit”事件。

并且：'123'股票：'1'

这是使用此数据创建HTTP POST请求。在GET表单中，它将是这样的URL：

/action/?id=123&stock=1

该示例可能只是随意选择值123和1来说明示例。您应该以某种方式从表单中获取这些值。

`$form = $(this)`

这只是将方法调用$(this)的结果赋给变量。

$实际上是一个jQuery方法。实质上，$(this)调用参数this上的函数。调用函数相对昂贵并且占用资源。但是，使用变量不是那么多。这样做效率更高：

$form = $(this);
$form.one();
$form.two();
$form.three();

而不是：

$(this).one();
$(this).two();
$(this).three();

前者只有4个方法调用，但后者有6个。

不要混淆：$form只是一个变量名。它可以被称为aform，form，x或任何其他有效名称。

用于在点击后再次更改提交按钮文本的javascript

2 个答案:

什么是form.stock指的是

并且：'123'股票：'1'

`$form = $(this)`