input type=file 获取文件的本地路径

根据input返回的文件,去获取文件地址

let getUrl = function(flie) {
    
    
    let url = ''
    if (window.createObjectURL!=undefined) {
    
     // basic
        url = window.createObjectURL(flie) ;
    }else if (window.webkitURL!=undefined) {
    
     // webkit or chrome
        url = window.webkitURL.createObjectURL(flie) ;
    }else if (window.URL!=undefined) {
    
     // mozilla(firefox)
        url = window.URL.createObjectURL(flie) ;
    }
    return url
}

监听input返回的文件,然后执行上面个的方法(本案例用的是jquery)

<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
$("#file1").change(() => {
    
    
    let url = getUrl($("#file1")[0].files[0])
    $('#img1').css("background-image","url(" + url + ")");
});

猜你喜欢

转载自blog.csdn.net/qq_34164814/article/details/106058589