Questo è il migliore che ho trovato finora. Sarei felice di sapere se qualcuno sa di un'alternativa più compatta o preferibile.
Modifica: snippet di codice aggiornato allo new pattern per la registrazione degli eventi.
import 'dart:html';
void main() {
query("#inputbox")
..onChange.listen(handler)
..onKeyDown.listen(handler)
..onKeyUp.listen(handler)
..onCut.listen(handler)
..onPaste.listen(handler);
}
void handler(Event event) {
print((query("#inputbox") as TextAreaElement).value);
}
Il comportamento precisa varierà tra i browser e sistemi operativi.
potete saltare keyDown
, ma essere consapevoli keyDown e keyUp comportamento è influenzato dal sistema operativo e isn't guaranteed to be symmetric. Potresti probabilmente perdere un cambiamento, almeno fino al prossimo keyUp o modificare l'evento. Effettivamente ho provato questo creando una piccola app su Windows 7 per inviare un messaggio WM_KEYDOWN orfano a Dartium e IE9.
keyPress
potrebbe essere utilizzato al posto di keyUp e keyDown, ma won't generate events per alcuni tasti come backspace e cancellare.
cut
e paste
reagire immediatamente a un taglio o incolla eseguito con il mouse. Se non li usi, l'evento change
acquisirà la modifica, ma non prima che il campo non perda lo stato attivo o sometimes even later.
L'evento input
potrebbe sostituire tutti i listener sopra e sembra funzionare perfettamente in Dartium, ma in IE9 acquisisce solo aggiunte di caratteri, non di rimozioni.
Nota keyUp
e keyDown
possono generare eventi indesiderati aggiuntivi per i tasti cursore, home, end, shift, ecc. (Ad es. In IE9). Si spara oltre ai listener taglia/incolla quando l'utente utilizza i tasti di scelta rapida per tali azioni.
Mentre la domanda è specifica di Dart, molte delle discussioni precedenti si applicano a qualsiasi codice che ascolta il DOM. Anche keyCode valori aren't standardized attraverso i browser (more detail).
Può anche essere utile verificare la classe KeyboardEventController, anche se in generale quando l'ho testato il comportamento del caso limite era simile a quello indicato sopra. Potrebbe essere o non essere di progettazione.Gli sviluppatori di Dart fanno un certo sforzo a insulate you da incoerenze tra browser, ma è ancora in corso.
anche mentre stiamo parlando di textarea, ricordatevi di usare la sua proprietà value
, not its text property. Infine, assicurati che il tuo handler
limiti le sue reazioni alle "esplosioni" dell'attività della tastiera (ad esempio una sorta di timer che rimanda brevemente le viscere del tuo gestore e arrotola eventuali eventi aggiuntivi che si verificano nel frattempo).
domande correlati e link: