js篇

1.正则表达式

非零的正整数  var reg = /^[1-9][0-9]*$/;

包含零或者正整数  var reg = /^(0|[1-9][0-9]*)$/;

非零开头最多带两位小数的数字 var reg = /^[1-9][0-9]*([\.][0-9]{1,2})?$/;

最多带两位小数的数字var reg = /^(0([\.][0-9]{1,2})?|[1-9][0-9]*([\.][0-9]{1,2})?)$/;

不包含特殊字符 var reg = /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/;

字母开头4-16位用户名 var reg = /^[a-zA-Z]\w{3,15}$/;

手机号码 var reg = /^1[3456789]{1}\d{9}$/;

邮箱 var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;

2.iframe实现无刷新图片上传

1.html文件

<div class="form-group">
      <label class="col-lg-2 control-label">封面图:</label>
            <div class="col-lg-10">
                  <form class="upload_pic_wrap" target="upload_file" enctype="multipart/form-data" method="POST" action="{{ buildUrl('/upload/pic') }}">
                      <div class="upload_wrap pull-left">
                         <i class="fa fa-upload fa-2x"></i>
                          <input type="file" name="pic" accept="image/png, image/jpeg, image/jpg,image/gif">
                       </div>
                   </form>
             </div>
      <iframe name="upload_file" style="display: none;"></iframe>
</div>

关键在于form表单的target属性和iframe标签的name值保持一致，这样一来，表单的action会在内置框架的iframe中进行提交

2.js文件

 // 上传封面图片
$('.upload_pic_wrap input[name=pic]').change(function () {
        $('.upload_pic_wrap').submit()
});

//无刷新上传图片
var upload = {
    error: function (msg) {
        common_ops.alert(msg);
    },
    success: function (file_key) {
        if (!file_key) {
            return false
        }
        var html = '<img src="' + common_ops.buildPictureUrl(file_key) + '"/>'
            + '<span class="fa fa-times-circle del del_image" data="' + file_key + '"></span>';
        //size() 方法返回被 jQuery 选择器匹配的元素的数量
        if ($(".upload_pic_wrap .pic-each").size() > 0) {
            $('.upload_pic_wrap .pic-each').html(html);
        } else {
            $(".upload_pic_wrap").append('<span class="pic-each">' + html + '</span>');
        }
        food_set_ops.delete_img();
    }
};

3. 后端代码

@route_upload.route('/pic',methods=['GET','POST'])
def upload_pic():
    """
    上传封面图片
    :return:
    """
    upfile = request.files.get('pic')
    callback_target = 'window.parent.upload'
    if not upfile:
        return "<script type='text/javascript'>{0}.error('{1}')</script>".format(callback_target, "上传失败")
    # 上传图片保存
    res = SaveImage(upfile)
    if res['code'] == -1:
        return "<script type='text/javascript'>{0}.error('{1}')</script>".format(callback_target, "上传失败:" + res['msg'])
    return "<script type='text/javascript'>{0}.success('{1}')</script>".format(callback_target, res['data']['file_key'])