Erkennen, wenn Benutzer beginnt/beendet Eingabe in jquery

Question

Sobald ich suchte eine Lösung für mein Problem und mein Problem war "Ich möchte erkennen, wenn Benutzer eingeben und wenn er aufhören zu tippen, damit ich den Status aktualisieren kann."

Ich habe ein Beispiel erstellt. Möge es für Sie funktionieren.

var typingTimer; 
var doneTypingInterval = 10; 
var finaldoneTypingInterval = 500; 

var oldData = $("p.content").html(); 
$('#tyingBox').keydown(function() { 
    clearTimeout(typingTimer); 
    if ($('#tyingBox').val) { 
    typingTimer = setTimeout(function() { 
     $("p.content").html('Typing...'); 
    }, doneTypingInterval); 
    } 
}); 

$('#tyingBox').keyup(function() { 
    clearTimeout(typingTimer); 
    typingTimer = setTimeout(function() { 
    $("p.content").html(oldData); 
    }, finaldoneTypingInterval); 
}); 



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 



<textarea id="tyingBox" tabindex="1" placeholder="Enter Message"></textarea> 
<p class="content">Text will be replace here and after Stop typing it will get back</p> 

View on Fiddle : http://jsfiddle.net/utbh575s/

Answer 1

, was Sie wollen, ist die debounce Funktionalität Vielleicht.

Grundsätzlich begrenzt es die Rate, mit der eine Funktion ausgelöst werden kann. So wartet es ein paar ms vor der Auslösung des Ereignisses wie der Benutzer den Schreibvorgang zu stoppen.

prüfen diese Schnipsel

// Returns a function, that, as long as it continues to be invoked, will not 
 
// be triggered. The function will be called after it stops being called for 
 
// N milliseconds. If `immediate` is passed, trigger the function on the 
 
// leading edge, instead of the trailing. 
 
function debounce(func, wait, immediate) { 
 
\t var timeout; 
 
\t return function() { 
 
\t \t var context = this, args = arguments; 
 
\t \t var later = function() { 
 
\t \t \t timeout = null; 
 
\t \t \t if (!immediate) func.apply(context, args); 
 
\t \t }; 
 
\t \t var callNow = immediate && !timeout; 
 
\t \t clearTimeout(timeout); 
 
\t \t timeout = setTimeout(later, wait); 
 
\t \t if (callNow) func.apply(context, args); 
 
\t }; 
 
}; 
 

 
// This will apply the debounce effect on the keyup event 
 
// And it only fires 500ms or half a second after the user stopped typing 
 
$('#testInput').on('keyup', debounce(function() { 
 
    alert('typing occurred'); 
 
    $('.content').text($(this).val()); 
 
}, 500));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="testInput" /> 
 

 
<p class="content"></p>

Grundsätzlich jetzt ist es an Ihnen. Stellen Sie Ihre eigene Zeit in ms und Sie sind gut zu gehen.