提交javascript时有轻微延迟

提交javascript时有轻微延迟,javascript,onclick,xmlhttprequest,setinterval,Javascript,Onclick,Xmlhttprequest,Setinterval,您好,我有一个聊天系统,工作正常,但当用户点击提交时,消息不会立即显示在发送者端,有轻微的延迟。有时它出现在发送方之前的接收方。对改善这种状况没有任何帮助 <script> function submitChat(){ if ( form1.msg.value == ''){ alert('enter your message'); return false; }

您好,我有一个聊天系统,工作正常,但当用户点击提交时,消息不会立即显示在发送者端,有轻微的延迟。有时它出现在发送方之前的接收方。对改善这种状况没有任何帮助

      <script>

    function submitChat(){

        if ( form1.msg.value == ''){

            alert('enter your message');
            return false;

        }

            $('#imageload').show();
            var msg = form1.msg.value;
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function(){
                if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
               // var Data = JSON.parse(xmlhttp.responseText);
                 document.getElementById('chatlogs').innerHTML;

                    $('#imageload').hide();


                }


            }
    xmlhttp.open('GET', 'insert.php?&msg='+msg, true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xmlhttp.send(null);
                    document.forms['form1'].reset();

            }


        $(document).ready(function(){
        $("#chatlogs").load('reg.php', function(){
        $("#chatlogs").animate({ scrollTop: $("#chatlogs")[0].scrollHeight}, "fast");
                  window.setInterval(function() { var elem = document.getElementById('chatlogs'); elem.scrollTop = elem.scrollHeight; }, 340);
            });
        });



        $(document).ready(function(e){

        $.ajaxSetup({cache:false});
        setInterval(function(){$('#chatlogs').load('reg.php')}, 2000);

        });

        $(document).keyup(function (e) {
    if ($(".chatbox:focus") && (e.keyCode === 13 && e.shiftKey === false)  ) {
            submitChat();
            e.preventDefault();
            }
         });

    </script>

函数submitChat(){
如果(form1.msg.value=''){
警报(“输入您的消息”);
返回false;
}
$('#imageload').show();
var msg=form1.msg.value;
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=函数(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
//var Data=JSON.parse(xmlhttp.responseText);
document.getElementById('chatlogs').innerHTML;
$('#imageload').hide();
}
}
open('GET','insert.php?&msg='+msg,true);
setRequestHeader(“内容类型”,“应用程序/x-www-form-urlencoded”);
xmlhttp.send(空);
document.forms['form1'].reset();
}
$(文档).ready(函数(){
$(“#聊天记录”).load('reg.php',function(){
$(“#聊天记录”)。动画({scrollTop:$(“#聊天记录”)[0]。scrollHeight},“fast”);
setInterval(function(){var elem=document.getElementById('chatlogs');elem.scrollTop=elem.scrollHeight;},340);
});
});
$(文档).ready(函数(e){
$.ajaxSetup({cache:false});
setInterval(function(){$('#chatlogs').load('reg.php')},2000年);
});
$(文档).keyup(函数(e){
if($(“.chatbox:focus”)&&(e.keyCode==13&&e.shiftKey==false)){
submitChat();
e、 预防默认值();
}
});

要做到这一点,您必须使用innerHTML将文本直接附加到页面,而无需等待服务器通过Ajax调用给出的答案。因为服务器端的处理总是需要时间,所以答案也是如此。然后,当你得到答案时,用ajax答案替换附加文本。

这个问题更适合codereview.stackexchange.com我不确定是否理解,请给我一个例子。我的意思是,就在var msg=form1.msg.value之后;在将消息发送到服务器之前,您可以将该值直接放入目标HTML元素中,然后在得到答案后,在块xmlhttp.status==200中,用答案替换发送的消息,以避免在聊天板中重复消息,因为在这种情况下,您只想在发送方显示发送的消息。