我看到当我在调用onpaste函数时尝试从textarea字段读取值时,我得到字段的旧值(粘贴操作之前的那个),而不是新值(粘贴操作之后的那个) .
以下是此行为的演示：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字段,然后再次选择“粘贴”. foo出现在div元素中.
由于我希望div元素始终使用粘贴操作显示textarea元素中更新的内容,因此所需的输出分别是步骤2和步骤3中的foo和foo foo.
我设法获得所需输出的一种方法是使用window.setTimeout()延迟update()函数调用,而不是
textareaElement.onpaste = update
我有
textareaElement.onpaste = function() {
window.setTimeout(update,100);
};
这一次(演示：http://jsfiddle.net/cwpLS/).这就是我想要的.然而,这更像是一种解决方法,而不是一种直接的方式来做我想做的事情.我想知道是否有任何替代或更好的方法来做到这一点.
解决方法
我很确定你setTimeout解决方案是实现所需效果的唯一方法,或者尝试访问剪贴板对象 – 如果你要使用跨浏览器和放大器,这可能会变得混乱.旧的浏览器支持.