$(document).ready(function(){
//图片显示插件
$.p_w_picpathFileVisible({wrapSelector: "#p_w_picpath-wrap",
fileSelector: "#file"
//,width: 100,height: 50
});
});
---------------------------------------------------
p_w_picpath-file-visible.js文件内容如下:
(function($) {
$.p_w_picpathFileVisible = function(options) {
// 默认选项
var defaults = {
//包裹图片的元素
wrapSelector: null,
//元素
fileSelector: null,
width: '100%',
height: 'auto',
errorMessage: "不是图片"
};
// Extend our default options with those provided.
var opts = $.extend(defaults, options);
$(opts.fileSelector).on("change",function(){
var file = this.files[0];
var p_w_picpathType = /p_w_picpath.*/;
if (file.type.match(p_w_picpathType)) {
var reader = new FileReader();
reader.onload = function() {
var img = new Image();
img.src = reader.result;
$(img).width(opts.width);
$(img).height(opts.height);
$(opts.wrapSelector).append(img);
};
reader.readAsDataURL(file);
} else {
alert(opts.errorMessage);
}
});
};
})(jQuery);