html源代码如下:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>图片上传</title>
</head>
<style>
    div#showdiv{
            width:200px;
        }
        img#showimg{
            cursor:pointer;
        }
</style>
<body>
<center>
    <form >
        <div id="showdiv">
            <label for="upfile">
                <img name="showimg" id="showimg" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=687491883,734414948&fm=26&gp=0.jpg" style="display:block;" alt="预览图片" width="300" />
            </label>
        </div>
        <input name="upfile" type="file" id="upfile" size="40" onchange="viewmypic(showimg,this.form.upfile);" style="display:none;" />
        <br />
    </form>
 
 
    <br />
    </div>
    <div style="display:none">
    </div>
</center>
<script>
    function viewmypic(mypic,upfile) {
        if(upfile.files && upfile.files[0])
        {
            mypic.style.display="";
        //火狐下,直接设img属性
        //mypic.src = upfile.files[0].getAsDataURL();
        //火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式
            mypic.src = window.URL.createObjectURL(upfile.files[0]);
        }
        else
        {
        //IE下
            if (upfile.value){
                mypic.src=upfile.value;
                mypic.style.display="";
                mypic.border=1;
            }
        }
    }
</script>
</body>
</html>