开始
由于业务需求,需要获取粘贴的内容,因此对浏览器的粘贴板展开了研究。
获取粘贴内容
框架使用的是Vue.js
handleCellPaste (e) {
console.log(e)
// IE浏览器 window.clipboardData
const clipboard = e.clipboardData || window.clipboardData
let clipboardData = void 0
try {
clipboardData = clipboard.getData('text/html')
} catch (e) {
console.error(e)
}
if (clipboardData) {
// 暂不开发 解析HTML 转换为Vue能处理的数据
console.log(clipboardData)
this.sheetData = clipboardData
} else {
try {
// 判断是否为IE浏览器,IE浏览器只能用 Text 参数
clipboardData = IEVersion() > -1 ? clipboard.getData('Text') : clipboard.getData('text/plain')
} catch (e) {
console.error(e)
}
if (clipboardData) {
// 解析文字 转换为Vue能处理的数据
console.log('clipboardData:', clipboardData)
this.sheetData += this.parsePasteText(clipboardData)
} else {
// 判断是否为图片
}
}
},
参考
知乎:JavaScript 如何获得粘贴的内容 ?
https://www.zhihu.com/question/20747877
MDN:粘贴板事件
https://developer.mozilla.org/zh-CN/docs/Web/API/ClipboardEvent
MDN:原始数据的类文件对象
https://developer.mozilla.org/zh-CN/docs/Web/API/Blob
MDN:常见 MIME 类型列表
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types