在html中显示本地图片

1.html代码

   <a id="a-upload">
<input id="imge" type="file" name="imge"/>更换头像
   </a>

2.js代码

  $("#a-upload").bind("change", function() {

// 根据这个 <input> 获取文件的 HTML5 js 对象 
var files = event.target.files, file; 
if (files && files.length > 0) { 
/ 获取目前上传的文件 
file = files[0]; 
// 来在控制台看看到底这个对象是什么 
onsole.log(file); 

// !!!!!! 
// 下面是关键的关键，通过这个 file 对象生成一个可用的图像 URL 
// 获取 window 的 URL 工具 
var URL = window.URL || window.webkitURL; 
// 通过 file 生成目标 url 
var imgURL = URL.createObjectURL(file); 
// 用这个 URL 产生一个 <img> 将其显示出来 
/*$('body').append($('<img/>').attr('src', imgURL)); */
// 使用下面这句可以在内存中释放对此 url 的伺服，跑了之后那个 URL 就无效了 
// URL.revokeObjectURL(imgURL); 
} 
$('#personalimge').attr('src',imgURL);

  });