安然不哭-西坝阿超个人博客

做技术一定要一颗恒心,这样才不会半途而废。

input file选择图片后 预览

2018-5-30 钟建超

简单的jQuery实现input file选择图片后,可以预览图片的效果

简单的HTML代码:

<div>
<img src="" class="img">
</div>
 
<input type="file" class="imgInput">

注:img就是用来显示预览图片的

然后就是jQuery代码,很简单


$(".imgInput").change(function(){
    $(".img").attr("src",URL.createObjectURL($(this)[0].files[0]));
});

然后就实现了选择图片后可以预览图片的效果了

其中需要注意的是使用的是DOM元素,jQuery元素和DOM元素之间的转换

标签: html