Javascript 如何在不使用webforms的情况下在aspx页面上上载文件？

我有一个aspx页面，其中已经有一个使用“asp:FileUpload”和webform上传文件的代码。在页面的另一部分，我想为用户添加上传文件的功能。但我不想使用webforms或“asp:fileupload”。

因此，我创建了一个HTML文件，作为iframe注入到aspx上的div标记中

<div id="iUploadDoc" style="height:50px;">
<iframe name='FileUpload'   id='FileUpload' class='iUploadFrame' width='100%' frameborder='0' border='0'src='DocUpload.htm'></iframe></div>

无论尝试了多少次，我都会不断收到有关HTTPPostedFileBase的错误或不允许序列化子项的错误。以下仅是我一直收到的一些错误（不是同时收到的）：

---

我该怎么办？

使用

请求.Files

。请显示您的代码，可能会出现各种问题。花点时间阅读：@AlexanderHiggins我已经添加了相当多的代码。希望有帮助。@SLaks你能再详细说明一下吗？此外，如果这有帮助，我还添加了代码

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">

<form method="POST" action="DocDetail.aspx.cs" id="docUpload" enctype="multipart/form-data">
        <div>
            <label for="fileUpload" class="inputLabel">Upload File</label>
            <input type="file" id="fileUpload" name="files"/>

        </div>
    </form>
<div id="progUpload" style="display: none;">
            <p class="uploadBox">Uploading...</p>
        </div>
        <span id= "selectedFile" style="display: none;"></span><span id="fileName" style="display: none;"></span>

window.onload = load;
function uploadDocFile() {  
    var prog = document.getElementById("progUpload");
    prog.style.cssText = 'display: block;';
    var x = document.getElementById("fileUpload");
    var txt = "";
    var filePath = "";
    var fileName = "";
    if (x.value == "") {
        txt += "Select a file.";
        document.getElementById("selectedFile").innerHTML = txt;
    } else {
        filePath = x.value;
        fileName = filePath.replace(/^.*[\\\/]/, '');
        txt += "<br>Selected file: ";
        document.getElementById("selectedFile").innerHTML = txt;
        document.getElementById("fileName").innerHTML = fileName;
    }

    var formInfo = document.getElementById("docUpload");
    document.getElementById("docUpload").style.display = "none";
    window.parent.getFormData(formInfo, x ,x.value, fileName);
}

function load() {
    var e = document.getElementById("fileUpload");
    //var formInfo = document.getElementById("docUpload");
    //fakeClick();
    e.onchange = function () {
        uploadDocFile();
    }
}

    DocUpload.prototype.uploadFileDoc= function (formInfo, uploadedFile, fileInfo, lastModifiedDate, name, extension, size, type) {
//blacklitsType is an array of types of file (similarly for blacklistExt) that should not be allowed to upload
if (indexOf.call(blackListType, type) < 0 && indexOf.call(blackListExt, extension) < 0) {    
var idParams = { OiD: ordId, pID: pId, QID: qId }
        var files = uploadedFile.files;
                    var fileEntries = [];
                    for (j = 0, len1 = files.length; j < len1; j++) {
                        file = files[j];
                        if (file.getAsEntry) {
                            entry = file.getAsEntry();
                        } else if (file.webkitGetAsEntry) {
                            entry = file.webkitGetAsEntry();
                        }
                        if (entry) {
                            isFyl = entry.isFile;
                            if (!isFyl) {
                                alert("You can not upload a folder. Uploading files (if present).");
                            } else {
                                fileItem = file.getAsFile();
                                fileEntries.push(fileItem);
                            }
                        } else if (!file.type && file.size % 4096 === 0) {
                            alert("You can not upload a folder. Uploading files (if present).");
                        } else {
                            fileEntries.push(file);
                        }
                    }


                PageMethods.UploadDocument(fileEntries[0], idParams, function (res) {
                    if (res == true) {
                        alert("File uploaded successfully.");                   
                    } else {                    
                        alert("File upload failed.");                   
                    }
                }, function (err) {
                    alert("ERROR: " + err._message);                
                });         

            } else {            
                window.alert('You cannot upload incorrect file types.');            
            }
            return;
        };

    DocUpload.prototype.getFormData = function (formInfo, uploadedFile, fileInfo, nameInfo) {
            var currDate, extension, lastModifiedDate, name, nameArr, size, type;
            currDate = new Date();
            lastModifiedDate = currDate;
            type = '';
            size = 512;
            name = nameInfo;
            nameArr = name.split(".");
            extension = nameArr[nameArr.length - 1];
            DocUpload.prototype.uploadFileDoc(formInfo, uploadedFile, fileInfo, lastModifiedDate, name, extension, size, type);
        };
    window.getFormData = DocUpload.prototype.getFormData;

    [System.Web.Services.WebMethod()]           
    [System.Web.Script.Services.ScriptMethod(UseHttpGet = false)]
    public static bool UploadDocument(HttpPostedFileBase uploadedFile,IdParams idParams) {
    bool err = false;
    try{ 
//code 
err= true;}
    catch(Exception ex){err = false;}
    return err;
        }  

No parameterless constructor System.Web.HttpPostedFileBase aspx, OR
The formatter threw an exception while trying to deserialize the message: There was an error while trying to deserialize parameter