0

jquery 1.9.1と私は、このようなキープレスイベントで単一の入力を持つフォームを送信しています

//    when user clicks post quick reply
    $('.quickResponse').focus(function() {
        var quickResponse = $(this);
        if (quickResponse.val() === 'post quick response') {
            quickResponse.val('');
        }
        quickResponse.keypress(function(e) {
            if (e.keyCode === 13 && quickResponse.val() !== '') {
                post(quickResponse.parent());
                return false;
            }
        });
        quickResponse.blur(function() {
            if (quickResponse.val() === '') {
                quickResponse.val('post quick response');
                quickResponse.remove();
            }
        });
    });

htmlは次のようになります

                <form action="comment" method="post">
                    <input class="quickResponse" type="text" name="comment" value="post quick response"/>
                    <input type="hidden" name="itemId" value="${item.itemId}"/>
                    <input type="hidden" name="posterId" value="${item.customerId}"/>
                </form>

post for は、ajax を介してフォームを送信し、ページを更新する json を返す単なる関数です。

問題は、ユーザーがフォームのぼやけに焦点を合わせて何度も焦点を合わせ直すと、スクリプトはフォームのすべてのインスタンスを保存し続け、ユーザーがリターン キーを押すと、すべてのフォーム オブジェクトが複数回送信されることです。どうすればこれを防ぐことができますか。

4

1 に答える 1

2

問題は、イベント ハンドラーで他​​の 2 つのイベントをバインドし続けることです。問題の直接の原因ではないかもしれませんが、フォームが悪いのです。代わりに一度バインドするだけです。

var quickResponse = $('.quickResponse');

quickResponse.focus(function() {
    if (quickResponse.val() === 'post quick response') {
        quickResponse.val('');
    }
}).keypress(function(e) {
    if (e.keyCode === 13 && quickResponse.val() !== '') {
        post(quickResponse.parent());
        return false;
    }
}).blur(function() {
    if (quickResponse.val() === '') {
        quickResponse.val('post quick response');
        quickResponse.remove();
    }
});
于 2013-08-16T11:34:55.960 に答える