1

マウスイベントを添付した送信ボタンがあります.one()。そうしないと、誤ってダブルクリックすると、情報が2回送信されます。

唯一の問題は、情報が送信されると、含まれてdivいるものを更新し(ページ全体を更新する必要はありません)、新しい情報が表示されることです。ただし、さらに情報を追加しようとすると、送信ボタンは既にクリックされているため、再度クリックすることはできません。

私はそれがリセットされることをリフレッシュしていると思っていましdivた....しかし、そうではありません。どうすればこれを修正できますか?

ありがとう

編集

JOE ive の助けを借りて、これを行いました。ただし、ダブルクリックすると2回発火します。私はこれを正しくしましたか?

    var clickActive = false;
$("body").on("click", '.post_comment_button', function(e){
        e.preventDefault();
        if(clickActive) return;
        else { 
        clickActive = true;
        var post = $(this).parents('.update_comment').parents('#post_comment');
        var anchor = $(post).siblings('.comment_list').find('ul:first');
        var comment = $(this).parents('.update_comment').children('textarea.post_comment').val();
        var user = $(this).parents('.update_comment').children('input.user').val();
        var msg_id = $(this).parents('.update_comment').children('input.message_id').val();
            if (comment == '')  loadComments();     
            else {
                $.post('messages.php', { 
                    comment: comment, 
                    message_id: msg_id, 
                    post_comment: 'true' }, function(data) {
                    //create new comment//  
                        $('body').append(data);
                        var newcomment = "<li><div class='comment_container'><div class='date'>less than 1 minute ago</div><div class='name'>" + user + " </div><div class='info_bar'><div class='edit_comment'><a href='#' class='comment_edit'>Edit</a></div><span>|</span><a href='#' class='delete_comment'>Delete</a></div><div class='fadeOut_comment'><div class='posted_comment'> " + nl2br(htmlEntities(comment.trim())) + " </div></div></li>";
                        $(post).slideUp(400);
                        $(newcomment).fadeIn(500, function() {
                            loadComments();
                        }).appendTo(anchor);
                        clickActive = false;
                });
            }
        }
});
4

1 に答える 1

2

もう 1 つの解決策は、ユーザーがボタンを 2 回続けてクリックできないように、ボタンを無効にすることです。次のロジックをコードに適合させます。

//Bind a click event handler to your button
$("body").on("click", "you_button_selector", function(e)
{
    //Prevent any default behaviour, we're dealing with this ourselves
    e.preventDefault();
    //First, disable the button
    $("your_button_selector").attr("disabled", "disabled");
    //Then, make your ajax call
    $.ajax(
    {
        url: "http://example.com",
        success: function(data)
        {
            //When your ajax call returns, enable the button again
            $("your_button_selector").removeAttr("disabled");
        }
    });
});
于 2013-06-08T16:55:50.000 に答える