＆QUOT;用户键入＆QUOT;在聊天功能 [英] "User is typing" function in chat

问题描述

我想加入聊天用户正在输入功能;聊天写在PHP + MySQL的/阿贾克斯。

I'm trying to add in chat a "user is typing" function; chat written in PHP + MySQL/Ajax.

它应该如何工作的：

- 当我的聊天伙伴X启动打字我在聊天中看到：X是输入

-when my chat partner X starts typing I see in my chat box: "X is typing"

- 当我（叫Y）我打字，他看到了他的聊天框：Y是打字（就像雅虎通）

-when I (named Y) am typing he sees in his chat box: "Y is typing" (just like Yahoo Messenger).

在code我试过到目前为止：

The code I've tried so far:

<script type="text/javascript" language="javascript">
    var timer = 0;

    function reduceTimer() {
        timer = timer - 1;
        isTyping(true);
    }

    function isTyping(val) {
        if (val == 'true') {
            document.getElementById('typing_on').innerHTML = "User is typing...";
        } else {

            if (timer <= 0) {
                document.getElementById('typing_on').innerHTML = "No one is typing -blank space.";
            } else {
                setTimeout("reduceTimer();", 500);
            }
        }
    }
</script>

<label>
    <textarea onkeypress="isTyping('true'); timer=5;" onkeyup="isTyping('false')" name="textarea" id="textarea" cols="45" rows="5"></textarea>
</label>
<div id="typing_on">No one is typing -blank speace.</div>

问题：

1. 如果我停了几秒钟，想想我的拼写它看起来像我已经停止打字。是否有一个更具相关性和更简单的方式来设置这个功能吗？是否有可能一个code为：

1. If I stop for a few seconds to think about my spelling it looks like I've stopped typing. Is there a more relevant and less complicated way to set this function? Is there possible a code for:

• 在文本框不为空（用户pressed任意键，以便开始打字） - >消息：用户键入
• 在文本框为空 - >消息：用户不输入
• 在文本框不为空，但用户尚未pressed任意键5秒以上 - >消息：用户不输入

这表明对自己说，我打字;我怎么能实现它或者，为了看我的聊天框的X用户键入，而不是我自己是打字。同为其它用户，他应该得到一个消息，关于我的打字/不打字，而不是他自己。

It shows to myself that I am typing; how could I implement it or where, in order to see in my chat box the "X user is typing" and not "Myself is typing". Same for the other user, he should get a message about me typing/not typing , not about himself.

感谢你。

推荐答案

我创建了一个小提琴，可能对您有所帮助。这个想法是使用JavaScript来刷新活动信息的setInterval 的功能。

I have created a fiddle that might be helpful to you. The idea is to refresh activity message using javascript setInterval function.

var textarea = $('#textarea');
var typingStatus = $('#typing_on');
var lastTypedTime = new Date(0); // it's 01/01/1970, actually some time in the past
var typingDelayMillis = 5000; // how long user can "think about his spelling" before we show "No one is typing -blank space." message

function refreshTypingStatus() {
    if (!textarea.is(':focus') || textarea.val() == '' || new Date().getTime() - lastTypedTime.getTime() > typingDelayMillis) {
        typingStatus.html('No one is typing -blank space.');
    } else {
        typingStatus.html('User is typing...');
    }
}
function updateLastTypedTime() {
    lastTypedTime = new Date();
}

setInterval(refreshTypingStatus, 100);
textarea.keypress(updateLastTypedTime);
textarea.blur(refreshTypingStatus);

这篇关于＆QUOT;用户键入＆QUOT;在聊天功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！