使用js配合input type=‘file‘标签设置图片的URL

最新推荐文章于 2022-09-23 09:09:45 发布

青从岁月

最新推荐文章于 2022-09-23 09:09:45 发布

阅读量1.7k

点赞数

分类专栏： HTML+JS

本文链接：https://blog.csdn.net/qq_15055395/article/details/78332323

版权

HTML+JS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

function getFileUrl(sourceId) {
            var url;
            if (navigator.userAgent.indexOf("MSIE") >= 1||(!!window.ActiveXObject || "ActiveXObject" in window)) { // IE 
                url = document.getElementById(sourceId).value;
            } else if (navigator.userAgent.indexOf("Firefox") > 0) { // Firefox 
                url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
            } else if (navigator.userAgent.indexOf("Chrome") > 0) { // Chrome 
                url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
            }
            return url;
 }
 $("#image-upload").bind('change', function () {
           $("#PayShowImage").attr("src", getFileUrl(this.id));
 });


 <img id="PayShowImage" width="100" height="100" class="validate[required]" src="" />
 <a href="javascript:;" class="btn btn-primary btn-lg" onclick="$('#image-upload').click();">上传</a>
<input type="file" name="file" id="image-upload" class="hidden" />
<input type="hidden" name="ImgPath" />