在Javascript中拦截粘贴事件

Bra*_*don 51 javascript dom copy-paste paste

有没有办法拦截JavaScript中的粘贴事件并获取原始值,更改它,并将关联的DOM元素的值设置为修改后的值?

例如,我有一个用户试图复制并粘贴一个包含空格的字符串,字符串的长度超过了我的文本框的最大长度.我想拦截文本,删除空格,然后使用更改值设置文本框的值.

这可能吗?

mae*_*ics 78

您可以通过附加"onpaste"处理程序拦截粘贴事件,并通过window.clipboardData.getData('Text')在IE中使用" "或event.clipboardData.getData('text/plain')在其他浏览器中使用" " 来获取粘贴的文本.

例如:

var myElement = document.getElementById('pasteElement');
myElement.onpaste = function(e) {
  var pastedText = undefined;
  if (window.clipboardData && window.clipboardData.getData) { // IE
    pastedText = window.clipboardData.getData('Text');
  } else if (e.clipboardData && e.clipboardData.getData) {
    pastedText = e.clipboardData.getData('text/plain');
  }
  alert(pastedText); // Process and handle text...
  return false; // Prevent the default handler from running.
};
Run Code Online (Sandbox Code Playgroud)

正如@pimvdb所指出的,e.originalEvent.clipboardData如果使用jQuery ,你将需要使用" ".

  • 它似乎也不适用于Firefox. (6认同)
  • 它看起来像[Firefox不允许剪贴板操作](http://stackoverflow.com/questions/127040/copy-put-text-on-the-clipboard-with-firefox-safari-and-chrome)... (4认同)
  • 对于那些像我一样,正在寻找拼图的最后一部分的人"用解析后的值设置文本框的值.",我使用以下内容进行最后的粘贴"document.execCommand("insertText",false,pastedText );" (4认同)
  • 如果您对`pastedText`进行任何形式的操作,@ Veve将无法正常工作。对? (2认同)