如何在页面中显示一张本地图片

[zj25810]

我现在需要将一张本地图片展示在页面中，不知道有什么可行的方法。


路径拿到，在浏览器窗口打开能显示，但是放在页面里显示不了

[nivk]

var files = {};

function previewImage(selector, obj, callback) {
    /// <summary>绑定图片预览</summary>
    /// <param name="selector" type="String">jQuery选择器</param>
    /// <param name="obj" type="Object">选项</param>
    /// <param name="callback" type="Function">回调函数</param>

    if (files[selector]) return;
    var file = document.createElement("input");
    file.type = "file";
    file.style.display = "none";
    file.accept = "image/*";

    files[selector] = file;

    $(file).change(function (e) {
        if (e.target.value == "") return;
        var file = e.target.files[0];

        if (typeof obj == "object") {
            if (obj.filesize && file.size > obj.filesize) return alert("您选择的文件大小为:" + Math.floor(file.size / 1024) + "k\r\n单张图片大小不能超过" + Math.floor(obj.filesize / 1024) + "k");
        }

        var img = new Image(), url = img.src = URL.createObjectURL(file);
        var $img = $(img);
        img.onload = function () {
            URL.revokeObjectURL(url);
            callback({
                image: img,
                fileElement: file,
                fromElement: fromEl
            });
        }

        e.target.value = "";
    });

    var fromEl = null;

    $(document.body).append(file);
    $(selector).click(function () {
        fromEl = this;
        file.click();
    });
}

previewImage(".click", {filesize: 102400}, function(e){
    document.body.appendChild(e.img);
});

<div class=".click">点我点我</div>

自己手写的代码，可能会有什么小BUG，请及时与我联系。

[zj25810]

有没有办法，把图片转成base64，再拿出来显示

[Go 旅城通票]

直接指定路径不行，用file对象给客户选择后可以。。 javascript客户端图片预览，兼容最新firefox，chrome和IE11

[slwsss]

没权限 搞不了

[冰雨无痕]

将图片，做成svg的代码形式把。