几秒后使用jQuery更改输入按钮文本

我正在使用表单和jQuery在网站上进行快速更改。 我想将按钮文本更改为“已保存!” 然后在几秒钟后将其更改回Update,以便用户可以再次更改该值。 当然他们可以打到现在’保存!’ 按钮再次,但它看起来不太好。

$("form.stock").submit(function(){ // Example Post $.post($(this).attr('action'), { id: '123', stock: '1' }); $(this).find(":submit").attr('value','Saved!'); // This doesn't work, but is what I would like to do setTimeout($(this).find(":submit").attr('value','Update'), 2000); return false; }); 

setTimeout的第一个参数是function。 所以将你的代码包装在一个匿名函数中,你就可以了。

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

我现在无法测试此代码。 如果它不起作用,请告诉我。

编辑:正如redsquare所建议的那样,从提交按钮本身创建闭包是有意义的。

如果它实际上是一个“按钮”标签然后改变它你会使用。

 $('#button_id').html('New Text'); 

当然,如果你正在为这个按钮执行onClick,那么你可以很容易地将(this)传递给函数作为对象和$(this).html(’New Text’); 代替。

希望这有助于某人。

或许,我建议使用不同的(在我看来更好的)界面来提供反馈,而不是更改按钮的文本。 您可以使用jGrowl或对话框小部件通过post方法的回调显示消息。

 $("form.stock").submit(function(){ $.post( $(this).attr('action'), { id: '123', stock: '1' }, function() { $.jGrowl("Your update was successfully saved."); } ); }); 

您可能希望将操作包装在函数中:

 setTimeout(function(){$(this).find(":submit").attr('value', 'Update')}, 2000); 
 $("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; });