近期做了一个小样例。在上传用户图像时,怎样在上传图片时显示图片。在网上找了非常多资料也未能如愿,如是,就用jquery ,html5,实现了,因为开发是在linux 所以未能在ie下測试。在forefox,chrom下是能够的。
一、html下的代码是:
<div class=' input_box' > <span class='spac' >头</span>相:<input class="input_style" id="'head_image'" name='headimage' type='file' ><label id="prompt_image">*</label> </div> <div style="height:60px; display:none;margin-bottom:10px;padding-left:50px;" id="show_box"> <img id="show_img"> </div>
二、jquery js 的代码:不同浏览器下的路径
function getObjectURL(file) { var url = null ; if (window.createObjectURL!=undefined) { // basic url = window.createObjectURL(file) ; } else if (window.URL!=undefined) { // mozilla(firefox) url = window.URL.createObjectURL(file) ; } else if (window.webkitURL!=undefined) { // webkit or chrome url = window.webkitURL.createObjectURL(file) ; } return url ; }
三、显示图像:
var strsrc=getObjectURL(this.files[0]); $("#show_img").attr("src",strsrc);