jquery 本地展示选择的图片

JS：

(function ($) {
    $.imageFileVisible = function (options) {
        // 默认选项
        var defaults = {
            //包裹图片的元素
            wrapSelector: null,
            //<input type=file />元素
            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 imageType = /image.*/;
            if (file.type.match(imageType)) {
                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);

　　2：调用

 //图片显示插件
            $.imageFileVisible({
                wrapSelector: "#image-wrap",//展示图片的位置id
                fileSelector: "#file",//文本框的id
                width: 100,
                height: 50
            });

　　3：html

 <input type="file" id="file"  accept="image/*" />
    <div id="image-wrap"></div>