Django之处理选择预览图片

来源:互联网 发布:mac怎么设置无线鼠标 编辑:程序博客网 时间:2024/06/05 15:57

代码实现:

 .user_avatar_file {            position: absolute;            top: 0;            left: 0;            opacity: 0;            margin-left: 15px;        }        .user_avatar_thumbnail {            position: relative;        }
<div class="form-group">                <label for="user_avatar" class="col-md-3 control-label">头像</label>                <div class="col-sm-offset-3 col-md-9">                    <img src="/static/images/beauty.jpg" alt="" id="user_avatar_thumbnail"                         style="width:100px;height:60px" class="user_avatar_thumbnail">                    <input type="file" class="user_avatar_file" id="user_avatar_file" style="height: 60px;width: 100px">                </div>            </div>
//处理缩略图保存        $('#user_avatar_file').change(function () {            var file = this.files[0];            var reader = new FileReader();            reader.readAsDataURL(file);            reader.onload = function () {                $('#user_avatar_thumbnail')[0].src = this.result            }        });
原创粉丝点击