Javascript OnPaste

Question

我现在有这样的想法：

<input type="text" placeholder="Paste text" onPaste="alert(this.value);">

这实际上是有效的，除了它返回一个空白的警告窗口。我没有得到任何价值。帮助?

Answer 1

onpaste事件在input的value更改之前触发。

<input type="text" placeholder="Paste text" onPaste="var e=this; setTimeout(function(){alert(e.value);}, 4);">​

我在一个全局变量中存储了一个对this的引用，因为在附加到窗口对象的超时函数的作用域中无法访问this。

我使用4毫秒作为超时，因为这是HTML5规范中的最小有效间隔/超时。编辑：正如注释中所指出的，您还可以使用0 miliseconds作为timeOut，它会自动重新计算为4。。

您也可以在onpaste事件中使用函数调用，将this作为参数传递，以防止您的HTML太多地与JS混合。:)

下面是一个更容易阅读的函数，您可以在多个输入中使用它：

function pasted(element) {
    setTimeout(function(){
        alert(element.value);
    }, 0); //or 4
}​

对于任何输入，只需使用onPaste="pasted(this)"就可以调用它。

Answer 2

这是因为onpaste事件在内容被粘贴到元素(link)之前触发，所以在您处理它的时候它还不存在。

现代浏览器支持在事件处理程序中获取剪贴板数据的方法。有关跨浏览器解决方案的尝试，请参阅JavaScript get clipboard data on paste event (Cross browser)。

此外，您可以通过在事件处理函数中启动一个计时器(10ms应该足够了)来解决您的问题，该计时器将在稍后检查您的输入值。