zoukankan      html  css  js  c++  java
  • 附件上传

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

    <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
  • 相关阅读:
    MySQL主从复制(Master-Slave)与读写分离(MySQL-Proxy)实践
    利用scp传输文件小结
    SSH无密码登录配置小结
    vim 清空
    mysql root用户 远程登录其它机器,看不到数据库
    音视频编解码开发经验2
    nginx、php-fpm、mysql用户权限解析
    ffmpeg处理RTMP流媒体的命令 发送流媒体的命令(UDP,RTP,RTMP)
    音视频编解码开发经验1
    mysql LAST_INSERT_ID 使用与注意事项
  • 原文地址:https://www.cnblogs.com/loveAline/p/9283474.html
Copyright © 2011-2022 走看看