input的文件上传图片

Posted 2020-09-16 张潇

<img id="headIMG" src="img/header_default.jpg"/>
<input type="file" name="upload_head" id="inputFile">
                        <script>
                $(document).ready(function() {
                    $("#inputFile").change(function() {
                        var fil = this.files;
                        for(var i = 0; i < fil.length; i++) {
                            reads(fil[i]);
                        }
                    });
                });
                function reads(fil) {
                    var reader = new FileReader();
                    reader.readAsDataURL(fil);
                    reader.onload = function() {
                        document.getElementById(‘headIMG‘).setAttribute(‘src‘,reader.result);
                    };
                }
            </script>

复制代码查看效果