<%@ page language="java" contentType="text/html; charset=GB18030"
pageEncoding="GB18030"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>Insert title here</title>
<style>
html,body{
height: 100%;
}
#textView{
width: 99%;
height: 99%;
border: 1px solid #ddd;
outline: 1px;
outline-color: red;
padding: 5px;
overflow-y: auto;
}
</style>
</head>
<body>
<div id="textView" contenteditable="true">
</div>
<script type="text/javascript">
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>
转载于:https://my.oschina.net/devwdj/blog/521913