用于聊天的Ajax用户键入消息
我正在尝试制作一个facebook风格的用户打字系统。 但我有一个关于按键的问题。
所以我的代码工作正常，但我想改变其他东西，如keypress，keyup，paste等。
我正在使用以下javascript和ajax代码。 在下面我的ajax代码就像if ($.trim(updateval).length == 0) { send width notyping.php notyping.php post 0并且0不显示输入消息。
if if ($.trim(updateval).length > 13) { send with usertyping.php usertyping.php发布1和1显示输入消息。
问题出现在这里，如果用户停止了一些消息，那么每次都在说打字。 我应该怎么做才能解决这个问题？在这方面，任何人都可以帮助我吗？
所有的ajax和javascript代码都在这里：
; (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);
检查文本值if为0然后发送数据为0表示用户没有输入
$('#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) { } }); }
检查文本值> 13然后发送数据为1用于用户输入。（可能需要更改此if语句）
if ($.trim(typingval).length > 13) { $.ajax({ type: "POST", url: "/usertyping.php", data: { tpy: tpy }, success: function(data) { } }); } });
检查并显示用户输入：
function getTyping(){ setInterval(function(){ var tpy = $('#tpy').val(); $.ajax({ type: "POST", url: "/getTyping.php", data: { tpy: tpy }, success: function(data) { $('#s').html(data); } }); },1000); } getTyping();
HTML
我对你的代码和应用有一些评论：
-
在第一个，正如@ rory-mccrossan所提到的，除非你有facebook，google或microsoft的基础设施……，我认为使用Ajax而不是
Websockets来实现像聊天这样的实时应用程序真是个坏主意。 -
现在关于你的代码，我不知道你的PHP脚本在幕后做了什么，但我认为你不需要发送两个请求来指示用户是否输入，你可以将其限制为一个请求当用户输入时发送，他肯定不会打字。 当然，您可以在
getTyping.php脚本中使用某种超时来限制“键入”状态的生命周期（例如5秒），因此如果在超时后发送请求，您可以知道您的用户不打字。 -
关于你当前的问题，我认为这是因为当textarea为空时，“不打字”状态才被触发，所以当然，在停止写入后，当前文本的长度超过13，所以“不打字”状态将永远不会被触发（发送），这就是为什么你需要超时，因为我在第二点告诉你…
-
另外，在使用
getTyping.php脚本获取状态时不要忘记缓存问题，该脚本应该不可缓存（或者至少在非常有限的时间内）… -
然后，我没有在你发布的代码中看到任何识别当前用户的信息以及与他一起转换的信息…也许你没有在问题中包括那个，我不知道！
…
希望能有所帮助。
我的建议是这里有外部setInterval，它将每3秒保存在oldValue变量中的当前文本，如果它们相等则将currentText与oldValue进行比较，然后用户停止写入，然后将ajax发送到notyping.php
你在下面给出了你的更新代码我创建了一个getTyping函数，如果用户开始输入，每隔1秒就会调用一次。
在get getTyping setinterval函数中我调用了函数check_which_function。
在函数check_which_funciton我通过在textarea值长度上应用条件来使用你的代码，这是嵌套的if else语句，所以现在
如果用户开始输入但内容长度为= 0
$ .trim（typingval）.length == 0将执行，直到length不等于12
如果内容的长度大于等于13
$ .trim（typingval）.length> 13将执行
默认情况下getTyping2（）函数正在执行此函数getTyping.php ajax调用正在执行