提交后更改提交按钮上的文本答案

【问题标题】：Change text on submit button after submission提交后更改提交按钮上的文本
【发布时间】：2014-05-03 16:11:27
【问题描述】：

提交后是否可以更改提交按钮上的文字？示例按钮包含单词提交，并且在用户提交表单后，按钮现在将显示完成。如果是这样，它是如何完成的？

谢谢！

【问题讨论】：

用户提交表单时会发生什么？是用 AJAX 处理，还是重新加载整个页面？
哦，是用AJAX处理的。
然后在$.ajax成功函数中修改（因为技术上只有在服务器报告之后才可以考虑处理）。

标签： jquery html forms submit submit-button

【解决方案1】：

如果您使用 AJAX 处理表单，您可以简单地在 $.ajax jQuery 方法的成功回调中更改按钮文本，如下所示：

$.ajax({
    ...
    success: function(data){
        ...
        // If using an <input/> as the submit button
        $('BUTTON_SELECTOR').prop('value', 'Done');

        // If using a <button/> as the submit button
        $('BUTTON_SELECTOR').text('Done');
        ...
    }
    ...
});

我希望这会有所帮助！

【讨论】：

【解决方案2】：

是的，这是可能的，您可以这样做：

<form name="MyForm">
<input type=button name="b1" value="Submit" onclick="javascript:document.MyForm.b1.value='Done'">
</form>

FIDDLE EXAMPLE HERE

【讨论】：

【解决方案3】：

$('#id_of_button').click(function( event ) {
    $('#id_of_button').prop('value', 'Text you want to change to');
});

编辑：实际上，更好的解决方案可能是将其绑定到表单的提交处理程序。

【讨论】：

【解决方案4】：

我们可以使用下面的代码。它会将提交按钮设置为“正在上传，请稍候...”，并带有微调器图标。

&lt;button name='button' type='submit' class='btn btn-primary right' data-disable-with="&lt;i class='fa fa-spinner fa-spin'&gt;&lt;/i&gt;Uploading please wait..."&gt;Save&lt;/button&gt;

【讨论】：