开发者社区> 问答> 正文

javascript如何在上传框中获取本地文件的地址

小旋风柴进 2016-03-23 14:10:49 954

是这样的,我想做一个图片上传前的预览功能,因此想读出上传框中本地文件的地址,然后把它设置为一个img标签的src地址,这样就可以展示出来。就像这样

<input type="file" id="file" name="img" />
<script>
$('#file').change(function () {
    $('<img src="' + $(this).val() + '" />').insertAfter(this);
});
</script>

但是我发现这里用$(this).val()取出来地址完全不是真实地址啊,都是类似c://fakepath/...之类

编解码 JavaScript 前端开发
分享到
取消 提交回答
全部回答(1)
  • 小旋风柴进
    2019-07-17 19:10:55

    我能想到三条线索:

    用HTML5的File API,Mozilla有个例子,虽然不是所有浏览器都支持,但我推荐这个方案,反正这些懒得去找一款好用的浏览器的人,也不会在乎你有没有这个预览功能。
    可用性最广泛的办法是选择了图片后,就把图片用个ajax请求上传到服务器,生成缩略图,取回来显示,但如果你的图片很大,那就没辙了,这样的接口也容易被人用来攻击你的服务器。
    再不然就是用flash了,如果用户浏览器的安全选项允许,可以直接操作本地的图片。

    0 0

集结各类场景实战经验,助你开发运维畅行无忧

推荐文章
相似问题
推荐课程