2012-04-02 16 views
-2

Ich habe ein Textfeld, das Ganzzahlen akzeptiert, und ich brauche es, um eine Funktion auszuführen, die die Eingabe des Textfelds verwendet, sobald ein Benutzer Zahlen in das Feld eingibt. Das Problem besteht darin, dass keyUp() jeden einzelnen Eingang erkennt. Also, wenn ich 23 tippe, wird es einmal für 2 und einmal für 3 feuern. Ich brauche es nur, wenn die Eingabe abgeschlossen ist.Textbox-Feld erkennen Ändern jQuery

Gibt es eine Möglichkeit, dies zu tun, ohne den Fokus zu verlieren und ohne einen Timer zu verwenden, der die Eingabe des Textfelds bei jeder Verwendung von setInterval überprüft?

+2

Wie werden Sie feststellen, wenn die Eingabe abgeschlossen ist? –

+0

Das ist die Sache. Kann ich einen Timer nur installieren, wenn der Benutzer beginnt, den Wert zu ändern und diesen für 1500 ms auszuführen? Ich habe jetzt eine SetInterval Brute Force-Methode, aber das stürzt den Browser ab, nachdem ich die Seite für ein paar Minuten ausgeführt habe und Sachen damit mache. – darksky

+0

@Nayefc - anstelle von setInterval, verwenden Sie setTimeout, löschen Sie das Timeout für Keydown und starten Sie es auf Key-up. – j08691

Antwort

0

Sie möchten benachrichtigt werden, wenn der Benutzer die Eingabe beendet. Der folgende Code kann als Startpunkt verwendet werden. Er ruft pufferedKeyUp 300 ms auf, nachdem der Benutzer die Eingabe beendet hat. http://jsfiddle.net/mendesjuan/VTMEe/

$(function() { 
    // Creates a handler that will wait until the event hasn't fired for a period 
    // before it fires the actual event handler 
    function createBuffered(fun, delay) { 
     var timer; 
     return function() { 
      clearTimeout(timer); 
      var args = arguments; 
      var me = this; 
      timer = setTimeout(function() { 
       fun.apply(me, args); 
      }, delay);   
     } 
    } 

    $('#in').keyup(createBuffered(function(){ 
     console.log('change'); 
    }, 300)); 
});​ 

Ext-JS hat eine schöne einfache Möglichkeit, dies http://jsfiddle.net/mendesjuan/DYkmU/1/

Ext.get('myid').on('keyup', function() { 
    console.log('change'); 
}, null, {buffer: 300}); 
zu tun
+0

Dies feuert "bufferedKeyUp" ab und hört niemals auf, auch wenn der Benutzer aufhört zu tippen. – darksky

+0

@Nayefc Nein, es ist nicht ... –

+0

@Nayefc, hast du es versucht? – Alexander

0

Warum nicht die Textbox Inhalt testen, nachdem sie verändert sind, nachdem das ist alles, wenn die Eingabe abgeschlossen ist, ist es nicht ?

Wenn das Ergebnis nicht in Ordnung ist, können Sie das Textfeld immer löschen und fokussieren, damit der Benutzer gültige Daten eingeben muss.

Etwas wie:

$("textbox").change(function() { 
    if (someTestForGoodData) { 
     handleTheGoodData(); 
    } else { 
     $(this).focus(); 
     alert($(this) + " has bad data!"); 
    } 
}) 
+0

Weil beide: "2" und "23123" sind "gute" Daten. Wie kannst du unterscheiden? – darksky

+0

Warum würden Sie unterscheiden? Wenn der Benutzer fertig mit der Eingabe ist und das Textfeld ein Änderungsereignis sendet, werden alle eingegebenen Daten in das Textfeld eingegeben, und das überprüfen Sie. Wenn es 2 groß ist, wenn es 23123 immer noch großartig ist. – kiswa

+0

Das OP ist nicht auf der Suche nach der Änderung Veranstaltung, die erfordert, dass das Feld Fokus verlieren –

0
$('input').on('input propertychange', function() { 
    $('#output').html($(this).val().length + ' characters'); 
}); 

Von this Antwort.