Vedo che quando provo a leggere il valore da un campo textarea quando viene chiamata la sua funzione onpaste
, ottengo il vecchio valore del campo (quello precedente all'operazione incolla), non il nuovo valore (quello dopo l'incolla funzionamento).Come ottenere il nuovo valore di un campo di input textarea su pasta?
Ecco una dimostrazione di questo comportamento: http://jsfiddle.net/qsDnr/
Una copia del codice segue:
<!DOCTYPE html>
<html>
<head>
<title>On Paste</title>
<script type="text/javascript">
var textareaElement;
var previewElement;
function update()
{
previewElement.innerHTML = textareaElement.value;
}
window.onload = function() {
textareaElement = document.getElementById('textarea');
previewElement = document.getElementById('preview');
textareaElement.onpaste = update
}
</script>
</head>
<body>
<textarea id="textarea">
</textarea>
<div id="preview">
</div>
</body>
</html>
è possibile confermare il comportamento con le seguenti operazioni.
- Copia la stringa
foo
negli Appunti. - Fare clic con il tasto destro del mouse sul campo textarea e selezionare "Incolla". Nulla appare nell'elemento div.
- Fare clic con il tasto destro del mouse sul campo textarea e selezionare di nuovo "Incolla".
foo
appare nell'elemento div.
Dal momento che voglio l'elemento div per mostrare sempre ciò che è stato aggiornato nel elemento textarea con l'operazione Incolla, l'output desiderato è foo
e foo foo
al punto 2 e, rispettivamente, il punto 3.
Un modo sono riuscito a ottenere il risultato desiderato è ritardando la chiamata update()
funzione con window.setTimeout()
, così invece di
textareaElement.onpaste = update
ho avuto
textareaElement.onpaste = function() {
window.setTimeout(update, 100);
};
questa volta (demo: http://jsfiddle.net/cwpLS/). Questo fa quello che voglio. Tuttavia, questo sembra più una soluzione alternativa piuttosto che un modo semplice per fare ciò che voglio. Vorrei sapere se esiste un modo alternativo o migliore per farlo.
[Questo evento] (https://developer.mozilla.org/en/DOM/element.onpaste) viene inviato quando l'utente * tenta * di incollare il testo - può significare che l'inpaste viene attivato prima che il testo venga incollato. – Joseph
'event.clipboardData.getData ('text/plain')' consente di ottenere il contenuto, verrebbe incollato, ma non sono sicuro che sia disponibile in ogni browser e anche il testo e la selezione correnti dovrebbero essere presi in considerazione. Ho paura, dovrai usare il timeout o tenere traccia di 'onkeyup' /' onmouseup'. – kirilloid
@Joseph Sono d'accordo.Sto cercando di capire se il problema che sto cercando di risolvere è meglio risolto con 'setTimeOut' come ho spiegato in questo post o se ci sono modi migliori per risolvere questo problema. –