Я вижу, что когда я пытаюсь прочитать значение из поля textarea, когда вызывается его функция onpaste
, я получаю старое значение поля (которое было перед операцией вставки), а не новое значениепосле операции вставки).
Вот демонстрация этого поведения: http://jsfiddle.net/qsDnr/
Ниже приведена копия кода:
<!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>
Вы можете подтвердить поведениесо следующими шагами.
- Скопируйте строку
foo
в буфер обмена. - Щелкните правой кнопкой мыши поле textarea и выберите «Вставить».Ничего не появляется в элементе div.
- Щелкните правой кнопкой мыши поле textarea и снова выберите «Вставить».В элементе div появляется
foo
.
Поскольку я хочу, чтобы элемент div всегда отображал то, что было обновлено в элементе textarea с помощью операции вставки, требуемый вывод - foo
и foo foo
на шаге 2 и шаге 3 соответственно.
Один из способов, которым мне удалось получить желаемый результат, - задержать вызов функции update()
с помощью window.setTimeout()
, поэтому вместо
textareaElement.onpaste = update
На этот раз у меня есть
textareaElement.onpaste = function() {
window.setTimeout(update, 100);
};
(демо: http://jsfiddle.net/cwpLS/).. Это делает то, что я хочу. Однако, это скорее обходной путь, чем прямой способ сделать то, что я хочу.хотел бы знать, есть ли альтернативный или лучший способ сделать это.