在 Internet Explorer 上粘贴事件侦听器获取错误参数答案

【问题标题】：Paste event listener on Internet Explorer getting wrong arguments在 Internet Explorer 上粘贴事件侦听器获取错误参数
【发布时间】：2015-05-08 14:02:14
【问题描述】：

我正在处理 contenteditable 的粘贴事件，以便在粘贴前清除所有 HTML 标记。在Firefox 和Chrome 中一切正常。但是当我在IE11 中测试我的代码时，传递的event object 不是ClipboardEvent，而是DragEvent。

我的代码有问题吗？如果我将侦听器添加为下面的代码，我是否应该获得剪贴板事件。为什么我会被拖累？

editable.addEventListener('paste', pasteHandler, false);

http://jsfiddle.net/vepo/4t2ofv8n/

为了测试上面的例子，我从 Chrome 复制一个文本并粘贴到 IE 中。但是我从 IE 复制任何文本都会得到同样的错误。

【问题讨论】：

stackoverflow.com/questions/39617938/…

标签： javascript html internet-explorer clipboard internet-explorer-11

【解决方案1】：

编辑

$(document).ready(function(){
    var editable = document.getElementById('editable-div');
    var pasteHandler = function(e){
        if(e.clipboardData && e.clipboardData.getData) {
            var pastedText = "";
            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);
        }
        else{
            alert('Not paste object!');
        }
    };
    editable.addEventListener('paste', pasteHandler, false);
});

这里我处理IE版本和其他浏览器。

JSFiddle

【讨论】：

HTMLDivElement 不支持attachEvent: msdn.microsoft.com/en-us/library/windows/apps/hh868700.aspx
@Victor 检查编辑它是解决您问题的新方法，处理程序很好，这是您获取剪贴板缓存的方式不正确。

【解决方案2】：

e.clipboardData 在 IE 上对我来说总是 null，所以我想出了这个：

var pastedText = '';
if (typeof e.clipboardData === 'undefined')
    pastedText = window.clipboardData.getData('Text')
else
    pastedText = e.clipboardData.getData('text/plain')

【讨论】：

【解决方案3】：

e.originalEvent.clipboardData.getData('text/plain') 适用于 ipad 上的 safari、chrome、firefox 和 safari 和 chrome。

window.clipboardData.getData('text') 适用于 Internet Explorer 和 Edge。

注意：e.originalEvent.clipboardData.getData('text') 适用于桌面浏览器，但不适用于移动浏览器。

所以最后我用了这个

var clipText;
  if (e.originalEvent.clipboardData !== undefined){
    clipText = e.originalEvent.clipboardData.getData('text/plain')
  } else {
    clipText = window.clipboardData.getData('text')
  }

【讨论】：

【解决方案4】：

$("element").on('paste', function (e)
{
if (window.clipboardData) 
{
pastedText = window.clipboardData.getData('Text')
}
else if (e.clipboardData || e.originalEvent.clipboardData != undefined)
{
pastedText = e.originalEvent.clipboardData.getData('text/plain')
}
}
});

【讨论】：

如果你能解释一下你的答案和问题中的问题，而不是仅仅粘贴代码，那就太好了
@sherein 您给出的代码看起来像 jquery，它不在问题的标签列表中。如果您在回答中引入新库，您至少应该解释如何以及为什么。