Javascript webkit-假网址

Question

Id 将图像(例如)从剪贴板粘贴到 webkit 可编辑内容区域时，源代码如下所示:

webkit-fake-url://DCAC99B9-BA40-4BA7-A419-9C60AAB081DA/image.png 

能够通过 javascript 访问图像并将其与文本一起发送回服务器吗？

Answer 1

显然，您可以对事件监听器使用任何抽象；我提供了一个未抽象的版本；这也将排除 IE < 9

if('addEventListener' in editableElement) {
    editableElement.addEventListener('paste', function(e) {
        // First two conditionals should weed out browsers which
        // don't allow access to pasted content
        if(('clipboardData' in e) && ('types' in e.clipboardData) &&
            e.clipboardData.types.indexOf('public.url') > 1) {
            e.target.ownerDocument.execCommand('insertImage', null,
                e.clipboardData.getData('public.url'));
            e.preventDefault();
            e.stopPropagation();
        }
    }, false);
}

在处理 WebKit 粘贴中的异常时，检查粘贴事件的 clipboardData 是个好主意:

console.dir(eventObj.clipboardData);

但根据我的经验，Web Inspector 似乎在显示控制台时检查内存中的事件对象，而不是当时和范围内的对象 console.dir 被调用。此时，paste 事件将结束并且 Javascript 对剪贴板的访问将被撤销，因此 types 属性将为 null并且实际的剪贴板数据将被隐藏。但在您的事件中，您可以这样做以更好地了解哪些类型可用以及它们的输出是什么:

for(var i = 0; i < eventObj.clipboardData.types.length; i++) {
    console.log(eventObj.clipboardData.types[i] + ':',
        eventObj.clipboardData.getData(eventObj.clipboardData.types[i]));
}

我花了比我愿意承认的更多的时间在 WebKit 浏览器中调试 clipboardData。希望这对您有所帮助!