先写一个input
**input** 中type=file onchange=show_photo(this)
加入图片的类型 accept="image/jpeg,image/png,image/gif"
(也可以写入image/* 接收所有图片类型 存在一定bug 手机上无法使用)
再写一个标签 接收图片
**div** 给以个**id=show_photo**
js代码
function show_photo(tag){
var file=tag.files[0]
//判断图片类型
if (filetype != "image/jpeg" && filetype !="image/png" && filetype != "image/gif") {
return false;
}
//将头像在页面上显示 FileReader是javascrip中一个读文件流
var r = new FileReader()
r.readAsDataURL(file)
r.onload = function () {
$("#show_photo").html("<img src ='" + r.result + "'/>")
}
]