单图上传显示2

<img src="{pigcms{$static_path}community/img/shequ01.png" alt=""/>
<input class="ipt-file" id="file1" type="file" name="img"/>


//图片预览
function aaa(id) {
var input1 = document.getElementById(id);
if (typeof FileReader === 'undefined') {
alert("抱歉,你的浏览器不支持 FileReader");
input1.setAttribute('disabled', 'disabled');
} else {
input1.addEventListener('change', readFile, false);
/*input1.addEventListener('change',function (e){
// console.log(e.target.files[0]);
console.log(this.files[0]);
},false); */
}
}

function readFile() {
var Othis = $(this);
var _this = this;
var file = this.files[0]; //获取上传文件列表中第一个文件
// console.log(file);
if (!/image\/\w+/.test(file.type)) {
//图片文件的type值为image/png或image/jpg
alert("文件必须为图片!");
return false;
}
var reader = new FileReader(); //实例一个文件对象
reader.readAsDataURL(file); //把上传的文件转换成url
//当文件读取成功便可以调取上传的接口
reader.onload = function (e) {

Othis.siblings('img').attr('src', this.result);
//删除预览图片
$('.img_wrap').on('click', '.close', function () {
$(this).parent().remove();
})
}
};
aaa('file1');
aaa('file2');
 
posted @ 2017-12-05 09:36  王玉岩  阅读(176)  评论(0编辑  收藏  举报