图片上传预览（可兼容IE8）

最新推荐文章于 2021-06-05 02:27:09 发布

weixin_34232363

最新推荐文章于 2021-06-05 02:27:09 发布

阅读量63

点赞数

原文链接：http://www.cnblogs.com/mylyl/p/6731859.html

版权

function uploadPreview (setting) { //图片上传预览
/*this(当前对象)*/
var _self = this;

/*判断为null或者空值*/
_self.IsNull = function (value) {
if (typeof (value) == "function") {
return false;
}
if (value == undefined || value == null || value == "" || value.length == 0) {
return true;
}
return false;
};

/*默认配置 */
_self.DefautlSetting = {
UpBtn: "",
DivShow: "",
ImgShow: "",
Width: 100,
Height: 100,
ImgType: ["gif", "jpeg", "jpg", "bmp", "png"],
ErrMsg: "选择文件错误,图片类型必须是(gif,jpeg,jpg,bmp,png)中的一种",
callback: function () {}
};

/*读取配置 */
_self.Setting = {
UpBtn: _self.IsNull(setting.UpBtn) ? _self.DefautlSetting.UpBtn : setting.UpBtn,
DivShow: _self.IsNull(setting.DivShow) ? _self.DefautlSetting.DivShow : setting.DivShow,
ImgShow: _self.IsNull(setting.ImgShow) ? _self.DefautlSetting.ImgShow : setting.ImgShow,
Width: _self.IsNull(setting.Width) ? _self.DefautlSetting.Width : setting.Width,
Height: _self.IsNull(setting.Height) ? _self.DefautlSetting.Height : setting.Height,
ImgType: _self.IsNull(setting.ImgType) ? _self.DefautlSetting.ImgType : setting.ImgType,
ErrMsg: _self.IsNull(setting.ErrMsg) ? _self.DefautlSetting.ErrMsg : setting.ErrMsg,
callback: _self.IsNull(setting.callback) ? _self.DefautlSetting.callback : setting.callback
};

/*获取文本控件URL */
_self.getObjectURL = function (file) {
var url = null;
if (window.createObjectURL != undefined) {
url = window.createObjectURL(file);
} else if (window.URL != undefined) {
url = window.URL.createObjectURL(file);
} else if (window.webkitURL != undefined) {
url = window.webkitURL.createObjectURL(file);
}
return url;
};

/*绑定事件 */
_self.Bind = function () {
document.getElementById(_self.Setting.UpBtn).onchange = function () {
Upimg(this);
};

function Upimg(Upbtn) {
var div = document.getElementById(_self.Setting.DivShow);
var img = document.getElementById(_self.Setting.ImgShow);

if (Upbtn.value) {
if (!RegExp("\.(" + _self.Setting.ImgType.join("|") + ")$", "i").test(Upbtn.value.toLowerCase())) {
alert(_self.Setting.ErrMsg);
return false;
}
if (navigator.userAgent.indexOf("MSIE") > -1) { //IE
try {
img.src = _self.getObjectURL(Upbtn.files[0]);
} catch (e) {
Upbtn.select();
top.parent.document.body.focus();
var src = document.selection.createRange().text;
document.selection.empty();
img.style.display = "none";
div.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
div.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = src;
}
} else { //谷歌火狐
img.style.display = 'block';
img.src = _self.getObjectURL(Upbtn.files[0]);
}
_self.Setting.callback();
}
}
};
_self.Bind();
}