防止多个ajax调用进入按下

时间:2017-01-20 17:12:13

标签: php jquery ajax

我正在使用php聊天插件。这个聊天插件的问题是,当通过按钮按下发送消息时它很有效但是当它设置为按下它时会调用太多的ajax调用。有时它会发送单个消息,有时会发送4 5条消息。我已经尝试了所有的解决方案,比如定义一个变量来检查它,但我不确定我在这里缺少的是用于发送消息的函数片段

$("#text-messages-request").on("focus", "textarea.type-a-message-box", function() {
    var ID = $(this).attr("id");
    var URL = $.base_url + 'ajax/add_chat_ajax.php';

    $('div.message-btn-target').html('<a href="#" id="' + ID + '" class="btn btn-default btn-sm send-message"><i class="glyphicon glyphicon-send"></i> ' + $.sendButton + '</a>');
    //$('#type-a-message').remove();    

    user_is_typing(this, ID);

    $(this).on('blur', function() {
        stop_type_status();
    });

    // Input Handler
    if ($.enterIsSend == true) {
        var running = false;
        $(document).bind("keypress", function(e) {
            if (e.which == 13) {
                if (running === false) {
                    running = true;
                    send_message(ID, URL);
                }
                return false;
            }
        });

        $("a.send-message").on("click", function() {
            if (running === false) {
                running = true;
                send_message(ID, URL);
                $(".type-a-message-box").focus();
            }
        });
    } else {
        $("a.send-message").on("click", function() {
            send_message(ID, URL);
            $(".type-a-message-box").focus();
        });
    }
    return false;
});

请帮助我坚持这几天。 有这个实时聊天功能,当两个用户都在线并且每7秒后一直呼叫时自动启动

setInterval("realtime_chat()", 7000);
function realtime_chat()
{   
last_msg_id = $(".msg-div").last().attr("id");

var ID = $("#text-messages").attr("rel");

var R_URL = $.base_url + 'ajax/refresh_unreadMessages_ajax.php';
var URL = $.base_url + 'ajax/chat_realtime_ajax.php';
var I_URL = $.base_url + 'ajax/chat_last_id.php';

var dataString = 'id='+encodeURIComponent(ID);


$.post(URL, dataString, function(html) {
    var html_response = $(html);
    var new_msg_id = html_response.attr("id");

    if(new_msg_id !== last_msg_id)
    {
        $("#text-messages").append(html);

    }

})


// deal with update counter and typing status
$('ul#messages-stack-list li').each(function() {
    cID = $(this).attr('id');
    cString = 'id='+cID;
    type_status(cID);
    update_unMsg_counter(R_URL, cString, cID, 'realtime');
});

title_unread_counter();

return false; }

如果数据库中存储了一些新消息,它只是附加内容。 这是我的文本框html

<div id="type" class="collapse border-top">
<textarea type="text" class="form-control border-none" id="type-a-message-  box" placeholder="Write the message"></textarea>
</div>

获取textarea内容的功能位于顶部,发送消息功能如下

function send_message(ID, URL)
{
    var textarea = $('textarea.type-a-message-box').val();
    if ($.trim(textarea).length == 0) 
    {
        alert($.emptyBox);
    } else {
        $.ajax({
            type: "POST",
            url: URL,
            data: {id: ID, message: textarea},
            cache: false,
            beforeSend: function() { $('#loadingDiv').show(); },
            error: function() { $('#loadingDiv').hide(); $('#errorDiv').html('<p>'+$.ajaxError+'</p>'); },
            success: function(html) {
                $('#loadingDiv').hide();
                $("p.no-messages").remove();
                $("#text-messages-request").html(html);
                $("#text-messages").attr("rel", ID);
                stop_type_status();
                $(".type-a-message-box").focus();

            }
        });
    }
}

希望它有助于制定解决方案

1 个答案:

答案 0 :(得分:0)

而不是 keypress 使用 Keyup 事件。