ajaxForm上傳文件到本地服務器（封裝）

不啰嗦，直接看代碼

1.html：

 <div class="con-item fix">
        <span class="f">文章封面<sup style="color: red"> *</sup></span>
        <div class="f con-item-img">
            <form method="post" enctype="multipart/form-data" id="Form_1" action="">
                <div class="upload-img">
                    <i ng-show="!infoModel.cover" class="ti-plus"></i>
                    <img ng-if="infoModel.cover" ng-src="{{infoModel.cover}}"/>
                    <input type="file" class="btn-file" id="input_1" name="file"/>
                </div>
            </form>
        </div>
    </div>

2.js封裝ajaxForm：（用flag判斷是因為當頁面中有多個上傳按鈕時，讓每一個form只初始化一次，如果不做判斷chenge事件和submit事件會綁定多次，結果就會提交多次）

var upLoadImage = {
    inputIdArr : [],
    formIdArr : [],
    start : function(formId, inputId, showRequest, callback){
        
        var options = {
            url : api.API_UP_LOAD_FILE,
            beforeSubmit:  showRequest,  //提交前處理
            success : callback,
            resetForm: true,
               dataType:  'json'
        };

        var flag = true;
        for(var i = 0; i < this.inputIdArr.length; i++)
        {
            if(this.inputIdArr[i] == inputId)
            {
                flag = false;
                break;
            }
        }
        if(flag) //相同的ID只綁定一次事件
        {
            $("#" + inputId).change(function(){
                $("#" + formId).submit();
            });
            this.inputIdArr.push(inputId);
        }
        
        var formFlag = true;
        for(var j = 0; j < this.formIdArr.length; j++)
        {
            if(this.formIdArr[j] == formId)
            {
                formFlag = false;
                break;
            }
        }
        if(formFlag)
        {
            $("#" + formId).ajaxForm(function(){});

            $("#" + formId).submit(function(){
            
                $(this).ajaxSubmit(options);
                return false;
            });
            this.formIdArr.push(formId);
        }
    },
}

3.調用方法

upLoadFile: function(){

        upLoadImage.start("Form_1", "input_1",
            function(formData) { //表單提交前被調用的回調函數
                var file = formData[0].value.type; //formData是表單文件的一個數組

                if (!/\/(?:jpg|png|bmp|pdf|mp4|MOV)/i.test(file)){   //這里可以限定上傳文件格式
                    alert("格式不正確！");

                    $("#input_1").val(""); //如果不成功就清空文件域，tip:在IE中安全設置的原因不允許清空文件域

                    return false; //如果“beforeSubmit”回調函數返回false，那么表單將不被提交
                }
            },
            function(responseText, statusText) { //表單提交成功后調用的回調函數
                if(statusText == "success")
                {
                    UpLoadCtrl.upLoadModel.pdfURL = responseText.data.url;
                    UpLoadCtrl.scope.$apply();
                }
            }
        )
    }

4.注：項目使用了angular js和themify字體