• 附件上传


    最近的事情比较多,也没时间去做总结,但是心里总感觉少点东西,还是把这坑记录下来吧

    <form id="uploadForm" enctype="multipart/form-data" method="POST">
    <div class="fileDIV clear">
    <p class="file_box"><input type="file" id="file1" name="myfile"/></p>
    <div class="file_btn fl">
    <span>上传附件</span>
    </div>
    <div class="file_name fl">未选择附件</div>
    <span class="delete_file fl"></span>
    </div>
     
    <div class="prompt">
    <span>支持通用文件格式:word、excel、pdf、图片等</span>
    </div>
    </form>
    -------------------js------------
    $("#uploadForm").on("change","#file1",function(){
    $scope.Astrict('#file1',['jpg','jpeg','png','docx','doc','dot','dotx','docm','dotm','bmp','jpeg','pdf','rar','xlsx','zip','xls','xlsm','xlt','xltx','xltm'],30);
    })
    $(".delete_file").click(function(){
    $("#file1").wrap('<form></form>');
    $("#file1").parent()[0].reset();
    $("#file1").unwrap();
    // $("#file1").after($("#file1").clone().val(""));
    // $("#file1").remove();
    $(".file_name").html("未选择附件");
    $(this).hide();
    })
    $scope.Astrict = function(fileObj,fileArr,size){
    var fil = $(fileObj).val().split(".");
    var ext = fil[fil.length -1].toLowerCase();
    var flag = false;
    for(var i = 0; i < fileArr.length; i++){
    if(ext.localeCompare(fileArr[i]) === 0){
    flag = true;
    break;
    }
    }
    if(flag){
    var name = $("#file1").val().split("\").pop();
    $(".file_name").html(name);
    $(".delete_file").show();
    }else{
    $("#file1").after($("#file1").clone().val(""));
    $("#file1").remove();
    $(".file_name").html("未选择附件");
    $(".delete_file").hide();
    layer.alert("类型不符合");
    }
    }
    if($("#file1").val() !== ""){
    var form = $("#uploadForm");
    form.ajaxSubmit({
    url:'',
    type:'POST',
    success:function(data){
    if(data=="ERROR"){
    alert("上传失败,请检查附件的大小与格式");
    }else{
    $scope.accessoryURL = data;
    }
    },
    error:function(data){
    alert("上传失败,单个附件限制30M");
    }
    });
    }
     
    引入
    jquery-1.7.1.js
    jquery.form.js
  • 相关阅读:
    ReentrantLock与Condition构造有界缓存队列与数据栈
    ReentrantLock
    文件下载
    scala初学
    bootstrap table 显示连续序号,分页有效
    web中servletcontext和applicationContext
    checkbox是否选中判断
    bookstrap form表单简单-smart-form
    charts柱状图,定时刷新
    js对象和json的区别
  • 原文地址:https://www.cnblogs.com/loveAline/p/9283474.html
Copyright © 2020-2023  润新知