Подтвердить что ты не робот

Как подождать, пока пользователь закончит запись в текстовом вводе для вызова функции?

Я проектирую веб-сайт, и я хотел бы иметь возможность вызывать функцию через 1 секунду после последнего ввода пользователя. Я попытался использовать onKeyUp, но он ждал 1 секунду после первого нажатия клавиши.

Кто-нибудь знает, как это возможно?

4b9b3361

Ответ 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 );" />

Этот фрагмент здесь.

Ответ 2

Вы можете использовать событие 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");
}

Ответ 3

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!");
}

Ответ 4

Просто измените свой 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')"

Ответ 5

Существует несколько простых плагинов, которые я сделал, что делает это намного глубже. Он требует гораздо меньше кода, чем некоторые предлагаемые решения, и он очень легкий (~ 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);