修改属性值-上传图片预览-03-25

//不行,这里的src作用不明
$('.js_imgUrl').src=$(".js_file").val();
//可行
$('.js_imgUrl').attr("src", $(".js_file").val());

//仅选择图片
<input type="file" accept="image/*">//加载速度可能会慢
//图片一般只规定几种类型就可以了

//可供学习
//如果选择上传文件的按钮有修改，则显示选中的文件，并且预览效果
$(function () {
        //修改，则触发功能
        $('.js_file').on('change', function () {
            var fileNames = '';
            $.each(this.files, function () {
                fileNames += '<span class="am-badge">' + this.name + '</span>';
            });
            $('#file-list').html(fileNames);
            $('.js_imgUrl').attr("src", $(".js_file").val());
        });
});

//提交的时候处理一下代码
<form class="form-horizontal" role="form" action="updateHeadImage.do" enctype="multipart/form-data"
method="post" onsubmit="return checkFileType();">

图片路径一般都是被封装过的，显示为C:/fakepath/P71111-194455.jpg
需要使用创建一个url，使用const objectURL = window.URL.createObjectURL(fileObj);
生成目录如：http://localhost:8080/0c373252-7285-4063-b063-935d98c18c82

参考博客
官方文档