input[type="file"]文件上传并保存

1. asp上传文件控件

<asp:FileUpload ID="fpUploadFile" runat="server" onChange="onFileChange()" />

//文件上傳改變事件
function onFileChange() {
    var file = document.getElementById("fpUploadFile");
    var uploadFileName = file.value;
    var fileExp = uploadFileName.substring(uploadFileName.lastIndexOf(".") + 1).toLowerCase();
    
    //检验文件格式
    if (fileExp!= "xls") {
        alert("請上傳xls文件！");
    }
};

后端(.cs文件)保存上传文件

UploadFile(this.fpUploadFile, "E:/xxxxx.xls");

#region 保存上傳文件
/// <summary>
/// 保存上傳文件
/// </summary>
/// <param name="fileUpload">上傳文件控件</param>
/// <param name="saveFilePath">保存文件路勁</param>
/// <returns></returns>
private void UploadFile(FileUpload fileUpload, string saveFilePath)
{
    try
    {
        if (fileUpload.HasFile)
        {
            string parentDir = Path.GetDirectoryName(saveFilePath);

            if (!Directory.Exists(Server.MapPath(parentDir)))
                Directory.CreateDirectory(Server.MapPath(parentDir));

            fileUpload.SaveAs(saveFilePath);
        }
    }
    catch (Exception Err)
    {
        throw Err;
    }
}
#endregion

2. 前后端分离时，上传文件

<input type="file" id="txtFile" onchange="onFileChange()" />

//文件上傳改變事件
function onFileChange() {
    var file = document.getElementById("txtFile");
    if (file) {
        var uploadFileName = file.value;
        var fileExp = uploadFileName.substring(uploadFileName.lastIndexOf(".") + 1).toLowerCase();
        //上傳的文件格式
        var exp = filePath.substring(filePath.lastIndexOf(".") + 1).toLowerCase();

        //检验文件格式
        if (exp != "xls" && exp != "xlsx") {
            alert("請上傳xls或xlsx文件！");
            return false;
        }

        var formData = new FormData();
        formData.append("file", file.files);

        $.ajax({
            type: "POST",
            url: "url",
            data: formData,
            processData: false,
            contentType: false,
            async: false,
            cache: false,
            success: function (res) {
            },
            error: function (res) {
                alert("文件上傳失敗！");
            }
        });
    }
};

 ashx保存上传文件

//處理上傳文件
private void UploadFile()
{
    if (this.context.Request.Files != null && this.context.Request.Files.Count > 0)
    {
        HttpPostedFile file = this.context.Request.Files[0];
        
        string saveDir = "E:/aaaaa";
        string saveFilePath = string.Format("{0}/{1}", saveDir, file.FileName);

        //創建文件目錄
        if (!Directory.Exists(saveDir))
            Directory.CreateDirectory(saveDir);
        
        //保存文件
        file.SaveAs(saveFilePath);
    }
}

3.扩展ext.js的上传文件控件

{
    fieldLabel: "选择文件",
    xtype: "textfield",
    inputType: "file",
    id: "extUploadFile",
    name: "extUploadFile",
    width: 250,
    labelWidth: 70,
    labelAlign: 'right',
    listeners: { 
        render: function () {
            Ext.fly(this.el).on('mousedown', function (event, inputEl) {
                //alert("xxxxxx");
                //return false;
            });
        },
        change: onFileChange 
    }
}