html頁面中div+javascript實現粘貼

時間 2019-11-13

標籤 html 頁面 div+javascript div javascript 實現粘貼欄目 HTML 简体版

原文原文鏈接

<%@ page language="java" contentType="text/html; charset=GB18030" javascript

pageEncoding="GB18030"%> html

<!DOCTYPE html> java

<html> web

<head> app

<title>Insert title here</title> spa

<style> prototype

html,body{ htm

height: 100%; ip

}

#textView{

width: 99%;

height: 99%;

border: 1px solid #ddd;

outline: 1px;

outline-color: red;

padding: 5px;

overflow-y: auto;

}

</style>

</head>

<body>

</div>

var text = document.getElementById("textView");

text.addEventListener("paste", function(event){

var clipboardData = event.clipboardData;

var file, reader;

Array.prototype.forEach.call(clipboardData.types, function(type, i){

var item = clipboardData.items[i];

var imageType = /image\/(png|jpg|webp|gif|bmp)/i;

//console.log(type, item.type, 'type');

if(type.match(imageType) || item.type.match(imageType)){

file = item.getAsFile();

reader = new FileReader();

reader.onload = function(evt){

console.log('result: ', evt, evt.target, evt.target.result);

var image = new Image();

image.src = evt.target.result;

text.appendChild(image);

};

reader.readAsDataURL(file);

}

});

}, false);

</script>

</body>

</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。