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

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));
 });


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

你可能感兴趣的:(HTML+JS)