//转载
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input id="haorooms_btn" type="button" value="图片显示">
<div id="haorooms_div"></div>
<script type="text/javascript">
function test(){
window.open('a.html?init=first')
}
function saveImg( key ){
var img = new Image,
canvas = document.createElement("canvas"),
ctx = canvas.getContext("2d"),
src='./timg.jpg'
img.crossOrigin = "Anonymous";
img.onload = function() {
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage( img, 0, 0 );
localStorage.setItem( key, canvas.toDataURL("image/png") );
}
img.src = src;
// make sure the load event fires for cached images too
if ( img.complete || img.complete === undefined ) {
img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
img.src = src;
}
}
function get(div,key){//读取get(容器,图片)
var srcStr = localStorage.getItem(key);
var imgObj = document.createElement('img');
imgObj.src = srcStr;
div.appendChild(imgObj);
}
window.onload = function(){
if(! localStorage.getItem('savedImageData')){
saveImg("savedImageData");
}
var haoroomsbtn = document.getElementById('haorooms_btn');
var oDiv = document.getElementById('haorooms_div');
haoroomsbtn.onclick = function(){
get(oDiv,"savedImageData");
}
}
</script>
</body>
</html>
网友评论