在提交按钮上将文本更改回默认值答案

【问题标题】：Change text back to default on submit button在提交按钮上将文本更改回默认值
【发布时间】：2014-03-26 02:47:40
【问题描述】：

所以我可以在提交后更改提交按钮上的文本。就像从“发送消息”一样，提交后它将变为“已发送”。几秒钟后是否可以将文本返回到“发送消息”？表单在 AJAX 中处理。

谢谢！

【问题讨论】：

标签： jquery ajax forms submit submit-button

【解决方案1】：

假设您有一个表单，其 id 名为 ajax-form，该表单中的输入字段具有 id：form-input 和名称：title，以及一个 id 为 submit-btn 的提交按钮.现在，让我们来做 ajax：

var ajaxForm   = $('#ajax-form'),
    submitBtn  = ajaxForm.find('#submit-btn');
ajaxForm.on('submit', function(e) {
  e.preventDefault();
  $.ajax({
    type: 'POST',
    url: ajaxForm.prop('action'),
    data: {
      title: ajaxForm.find('input').val()
    },
    dataType: 'json',
    beforeSend: function() {
      submitBtn.text('Send message');
    },
    success: function() {
      submitBtn.text('Sent');
    },
    complete: function() {
      setTimeout(function() {
        submitBtn.text('Send message'); // Change it back after 4 seconds
      }, 4000);
    }
  });
});

您可能需要添加错误处理程序。有关更多信息，请参阅 jQuery AJAX 文档： http://api.jquery.com/jQuery.ajax/

希望对您有所帮助。 :)

【讨论】：