当用户完成输入而不是按键时运行javascript函数?

Run javascript function when user finishes typing instead of on key up?(当用户完成输入而不是按键时运行javascript函数?)
本文介绍了当用户完成输入而不是按键时运行javascript函数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我想在用户输入完文本框后触发 ajax 请求.我不希望它在每次用户输入字母时都运行该函数,因为这会导致大量的 ajax 请求,但我也不希望他们必须点击 enter 按钮.

I want to trigger an ajax request when the user has finished typing in a text box. I don't want it to run the function on every time the user types a letter because that would result in A LOT of ajax requests, however I don't want them to have to hit the enter button either.

有没有办法让我可以检测到用户何时完成输入然后执行 ajax 请求?

Is there a way so I can detect when the user has finished typing and then do the ajax request?

在这里使用 jQuery!戴夫

Using jQuery here! Dave

推荐答案

所以,我猜想完成输入意味着你只需停一会儿,比如 5 秒.因此,考虑到这一点,让我们在用户释放一个键时启动一个计时器,并在他们按下一个键时清除它.我决定有问题的输入是#myInput.

So, I'm going to guess finish typing means you just stop for a while, say 5 seconds. So with that in mind, lets start a timer when the user releases a key and clear it when they press one. I decided the input in question will be #myInput.

做一些假设......

Making a few assumptions...

//setup before functions
var typingTimer;                //timer identifier
var doneTypingInterval = 5000;  //time in ms, 5 second for example
var $input = $('#myInput');

//on keyup, start the countdown
$input.on('keyup', function () {
  clearTimeout(typingTimer);
  typingTimer = setTimeout(doneTyping, doneTypingInterval);
});

//on keydown, clear the countdown 
$input.on('keydown', function () {
  clearTimeout(typingTimer);
});

//user is "finished typing," do something
function doneTyping () {
  //do something
}

这篇关于当用户完成输入而不是按键时运行javascript函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!

相关文档推荐

How do I can get a text of all the cells of the table using testcafe(如何使用 testcafe 获取表格中所有单元格的文本)
node_modules is not recognized as an internal or external command(node_modules 未被识别为内部或外部命令)
How can I create conditional test cases using Protractor?(如何使用 Protractor 创建条件测试用例?)
PhantomJS and clicking a form button(PhantomJS 并单击表单按钮)
Clicking #39;OK#39; on alert or confirm dialog through jquery/javascript?(在警报上单击“确定或通过 jquery/javascript 确认对话框?)
QunitJS-Tests don#39;t start: PhantomJS timed out, possibly due to a missing QUnit start() call(QunitJS-Tests 不启动:PhantomJS 超时,可能是由于缺少 QUnit start() 调用)