Ajax用户键入聊天消息

我对您的代码和应用程序有一些看法：

• 首先，正如@rory mccrossan所提到的，除非你有facebook、谷歌或微软的基础设施。。。，对于聊天之类的实时应用程序，我认为使用Ajax而不是Websockets确实是个坏主意。

• 现在关于你的代码，我不知道你的PHP脚本在幕后做什么，但我认为你不需要发送两个请求来表明用户是否在打字，你可以限制在用户打字时发送一个请求，否则，他肯定不会打字。当然，您可以在getTyping.php脚本中使用某种超时来限制"正在键入"状态的生存时间（例如5秒），因此，如果在该超时之后发送请求，您可以知道您的用户没有在键入。

• 关于你目前的问题，我认为这是因为"不打字"状态只是在文本区域为空时触发的，所以当然，在停止写作后，当前文本的长度超过13，所以"不打字"状态永远不会被触发（发送），这就是为什么你需要暂停，就像我在第二点告诉你的那样。。。

• 此外，当使用getTyping.php脚本获取状态时，不要忘记缓存问题，该脚本应该是不可缓存的（或者至少在非常有限的时间内）。。。

• 然后，我在你发布的代码中看不到任何信息来识别当前用户和与他一起转换的用户。。。也许你没有把它包括在问题中，我不知道！

希望这能有所帮助。

我在这里建议使用外部setInterval，它将每3秒将当前文本保存在oldValue变量中，并将currentText与oldValue进行比较。如果它们相等，则用户停止写入，然后将ajax发送到notyping.php

您的更新代码如下所示我创建了一个getTyping函数，如果用户开始打字，它将每隔1秒调用一次。

在getGetTyping setinterval函数中，我调用了一个函数check_which_function。

在函数check_which_funciton中，我通过对嵌套if-else语句中的textarea值长度应用条件来使用您的代码，所以现在

如果用户开始键入，但如果内容长度=0而不是

$.trim（typeingval）.length==0将执行，直到长度不等于12

如果内容长度比大等于13

$.trim（typeingval）.length>13将执行

默认情况下，getTyping2（）函数在此函数中执行getTyping.php ajax调用正在进行

<script>
    (function ($) {
        $.fn.extend({
            donetyping: function (callback, timeout) {
                timeout = timeout || 1000; // 1 second default timeout
                var timeoutReference,
                        doneTyping = function (el) {
                            if (!timeoutReference)
                                return;
                            timeoutReference = null;
                            callback.call(el);
                        };
                return this.each(function (i, el) {
                    var $el = $(el);
                    // Chrome Fix (Use keyup over keypress to detect backspace)
                    // thank you @palerdot
                    $el.is(':input') && $el.is(':input') && $el.on('keyup keypress paste', function (e) {
                        // This catches the backspace button in chrome, but also prevents
                        // the event from triggering too premptively. Without this line,
                        // using tab/shift+tab will make the focused element fire the callback.
                        if (e.type == 'keypress' && e.keyCode != 8)
                            return;
                        // Check if timeout has been set. If it has, "reset" the clock and
                        // start over again.
                        if (timeoutReference)
                            clearTimeout(timeoutReference);
                        timeoutReference = setTimeout(function () {
                            // if we made it here, our timeout has elapsed. Fire the
                            // callback
                            doneTyping(el);
                        }, timeout);
                    }).on('blur', function () {
                        // If we can, fire the event since we're leaving the field
                        doneTyping(el);
                    });
                });
            }
        });
    })(jQuery);

    function getTyping2() {
        var tpy = $('#tpy').val();
        $.ajax({
            type: "POST",
            url: "/getTyping.php",
            data: {tpy: tpy},
            success: function (data) {
                $('#s').html(data);
            }
        });
    }
    function check_which_action() {
        $('#chattextarea').donetyping(function () {
        var typingval = $("#chattextarea").val();
        var tpy = $('#tpy').val();
        if ($.trim(typingval).length == 0) {
            $.ajax({
                type: "POST",
                url: "/notyping.php",
                data: {
                    tpy: tpy
                },
                success: function (data) {
                }
            });
        }
        else if ($.trim(typingval).length > 13) {
            $.ajax({
                type: "POST",
                url: "/usertyping.php",
                data: {
                    tpy: tpy
                },
                success: function (data) {
                }
            });
        }
        else {
            getTyping2() ;
        }
    });
    }
    function getTyping() {
        setInterval(check_which_action, 1000);
    }
    getTyping();
</script>
<textarea id="chattextarea"></textarea>
<div id="s"></div>