javascript - 提交表单后重置 jQuery 输入字段字符倒计时

Question

我的目标是将表单输入限制为 220 个字符。我可以使用一些服务器端 PHP 和 maxlength 属性来做到这一点。

我的问题与我在页面上显示的字符倒计时有关，该倒计时向用户显示在达到输入字段中可以输入的最大字符数之前还剩下多少个字符。

我已经完成了下面的演示。

演示: http://jsfiddle.net/GPmq8/

您将看到计数器随着用户在输入字段中键入内容而减少。这一点正在工作。

用户提交表单后，我希望计数器返回到 220(即重置自身)。我如何修改我的脚本来做到这一点？ 注意，我的表单是通过 AJAX 提交的，因此无需重新加载页面。

Answer 1

我在您的示例中没有看到任何表单标记，但您可以尝试当有人单击“提交”时恢复输入的值

<input type="text" placeholder="Type something..." class="form-entry" name="form-entry" rows="1" maxlength="220" value="" />
<div><button name='Mybutton' id='MyButton'>Submit</button></div>
<hr />
<span class="countdown"></span>

function updateCountdown() {
    // 220 is the max message length
    var remaining = 220 - jQuery('.form-entry').val().length;
    jQuery('.countdown').text(remaining + '');
}

jQuery(document).ready(function($) {
    updateCountdown();
    $('.form-entry').change(updateCountdown);
    $('.form-entry').keyup(updateCountdown);

    $('#MyButton').click(function(){
        jQuery('.countdown').text('220');
        jQuery('.form-entry').val('');

    });

});

http://jsfiddle.net/GPmq8/