You need to paste a piece of content with text and pictures, but the pictures need to be uploaded to the server separately. How to select the pictures from the pasted content. .
General idea:
Listen to onpaste event
Get the clipboard data event.clipboardData
through the event parameter in the event callback (not supported by all browsers)
// '/image/.test(event.clipboardData.types)' // 檢查是否為圖片
// 獲取圖片二進(jìn)制數(shù)據(jù)(似乎瀏覽器的實(shí)現(xiàn)都會(huì)有大小差異)
Array.each(event.clipboardData.items, function(item){
if (/image/.test(item.type)) {
var blob = item.getAsFile();
var URL = window.URL || window.webkitURL;
var source = URL.createObjectURL(blob);
console.log(source)
}
});
Send data to the backend server through Ajax. After the backend stores the image, it returns an accessible address of the image
Visit this address to see the pictures