Id 将图像(例如)从剪贴板粘贴到 webkit 可编辑内容区域时,源代码如下所示:
webkit-fake-url://DCAC99B9-BA40-4BA7-A419-9C60AAB081DA/image.png
能够通过 javascript 访问图像并将其与文本一起发送回服务器吗?
最佳答案
显然,您可以对事件监听器使用任何抽象;我提供了一个未抽象的版本;这也将排除 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
。希望这对您有所帮助!
关于Javascript webkit-假网址,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4108459/