Я проектирую веб-сайт, и я хотел бы иметь возможность вызывать функцию через 1 секунду после последнего ввода пользователя. Я попытался использовать onKeyUp, но он ждал 1 секунду после первого нажатия клавиши.
Кто-нибудь знает, как это возможно?
Я проектирую веб-сайт, и я хотел бы иметь возможность вызывать функцию через 1 секунду после последнего ввода пользователя. Я попытался использовать onKeyUp, но он ждал 1 секунду после первого нажатия клавиши.
Кто-нибудь знает, как это возможно?
Другой подобный подход, без глобалей:
var typewatch = function(){
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
}
}();
...
<input type="text" onKeyUp="typewatch(function(){alert('Time elapsed!');}, 1000 );" />
Этот фрагмент здесь.
Вы можете использовать событие keyDown
(или keyUp
), которое устанавливает функцию для запуска через 1 секунду, и если пользователь вводит другой ключ в течение этой секунды, вы можете очистить тайм-аут и установить новый.
например.
var t;
function keyDown()
{
if ( t )
{
clearTimeout( t );
t = setTimeout( myCallback, 1000 );
}
else
{
t = setTimeout( myCallback, 1000 );
}
}
function myCallback()
{
alert("It been 1 second since you typed something");
}
Nevermind, я нашел способ сделать это. Я вызываю функцию на каждом onkeyup(), которые увеличивают счетчик, а затем ждут 1 секунду. По истечении 1 секунды он уменьшает счетчик и проверяет, равно ли оно 0.
var keystrokes = 0;
function askAgain()
{
++keystrokes;
setTimeout(reveal, 1000);
}
function reveal()
{
--keystrokes;
if (keystrokes == 0)
alert("Watch out, there is a snake!");
}
Просто измените свой html-вход и переместите эту первую строку в свои существующие функции, чтобы не переделывать все, что у вас есть. Это не повлияет на любые старые функции кодового вызова, так как если onkeypress
не задано, то mykeypress
всегда будет < 1.
var mykeypress=0;
var mysleep=1000; //set this higher if your users are slow typers
function mytest(id,text) {
mykeypress--; if(mykeypress > 0) { return; }
//anything you want when user stops typing here
alert("Keypress count at "+mykeypress+" ready to continue
id is "+id+" arguement is "+text);
}
input type="text" name="blah" id="55" onkeypress="mykeypress++"
onkeyup="myid=this.id;setTimeout(function (){mytest(myid,'a test')},mysleep)"
REVERT to old way seamlessly:
input type="text" name="blah" id="55" onkeyup="mytest(this.id,'a test')"
Существует несколько простых плагинов, которые я сделал, что делает это намного глубже. Он требует гораздо меньше кода, чем некоторые предлагаемые решения, и он очень легкий (~ 0,6kb)
Сначала вы создаете объект Bid
, чем может быть bumped
в любое время. Каждый удар замедляет обратный вызов Bid для следующего заданного времени.
var searchBid = new Bid(function(inputValue){
//your action when user will stop writing for 200ms.
yourSpecialAction(inputValue);
}, 200); //we set delay time of every bump to 200ms
Когда объект Bid
готов, нам нужно bump
его каким-то образом. Пусть прикрепляется наклон к keyup
event
.
$("input").keyup(function(){
searchBid.bump( $(this).val() ); //parameters passed to bump will be accessable in Bid callback
});
Что происходит здесь:
Каждый пользователь нажимает клавишу, ставка "задерживается" (набивается) на следующие 200 мс. Если 200 мс пройдут без лишних ударов, обратный вызов будет запущен.
Кроме того, у вас есть две дополнительные функции для остановки ставки (если пользователь нажал esc или нажал внешний вход, например), а также для немедленного завершения и немедленного завершения обратного вызова (например, когда пользователь нажимает клавишу ввода):
searchBid.stop();
searchBid.finish(valueToPass);