图片上传 预览 及 获取base64

来源:互联网 发布:中信淘宝网联名信用卡 编辑:程序博客网 时间:2024/04/29 15:08
<div class="row">                                <div class="col-lg-1 form-group">                                    <button type="button" class="btn btn-default img_upload_btn">选择图片 </button>                                    <input type="file" name="file" class="img_upload_file" multiple="multiple" style="display: none" />                                     <input type="hidden" name="img_upload_base" class="img_upload_base" />                                </div>                                <div class="col-lg-2 form-group">                                    <label>图片预览</label> <img class="img_upload_show" />                                </div>                            </div>
$(".img_upload_btn").click(function() {            $(".img_upload_file").click();        });        $(".img_upload_file").change(function() {            var file = this.files[0];            var reader = new FileReader();            reader.readAsDataURL(file);            reader.onload = function(e) {                $(".img_upload_show").attr("src", this.result);                $(".img_upload_base").val(this.result);            };        });
0 0
原创粉丝点击