javascript简单代码实现图片上传预览

废话不多说,直接贴代码

function getObjectURL(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
}

作为笔记用,先贴上后面再解释

用法

html:
<label class="btn btn-default"><span>选择文件</span> <input type="file" class="uploadimg" name="img" /></label>
<div class="imgBox"><img src="" class="imgPrvew"></div>

$('.uploadimg').on('change', function() {
    var imgUrl = getObjectURL(this.files[0]);
    $(".imgPrvew").attr('src', imgUrl)
});

function getObjectURL(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
}

先这样....

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,403评论 25 708
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,246评论 4 61
  • 洛莘出生那一日,正是姜城的桃花烂漫时。听娘亲说,她出生时满室桃花幽香,时人莫不赞叹。五岁的洛莘似懂非懂,只是见娘亲...
    狐狸九叶阅读 881评论 0 1
  • 值不值得 文/小燕儿 经常听到一些朋友说,恩,这个人值得喜欢,因为ta正直专一,事业心强,...
    珈珞的小世界阅读 274评论 0 0
  • 如何应对「披萨不就是个大饼铺点肉」、「寿司不就是放块鱼在米饭上」这种言论? 评论里许多人在说披萨在国外就是贫民食物...
    天霜堂堂主阅读 180评论 0 1