Question

我正在尝试在asp.net中创建一个文件上传器，该文件上传器可以上传文件并在我的网格中显示它们，并且可以单独查看它们，但是我不想使用asp控件。我想通过使用html标签来做到这一点。我看过的所有教程都使用asp控件。以下是我的html：

               <tr>
                <td class="label" style="width:15%">
                File Name
                 </td>
                <td class="description" >
                <input type="text" id="txtFileName" class="largeTextField"  style="width:260px;"/>
               </td>

               <div class="validator" id="txtFileNameVld" style="display: none">
                                                        *</div>

                                            </tr>


               <tr>                              
               <td class="label" style="width:15%">
                Upload File
                </td>
                 <td class="description" >
                <input type="file" id="FileUpload1" class="largeTextField" multiple="multiple"   
                style="width:260px;"/>
               <input type="button" id="btnUpload" value="Upload"  onclick="Upload" />
               </td>

                <div class="validator" id="txtUploadFileVld" style="display: none">
                                                        *</div>

                                            </tr>

我想创建一个上传函数，但是我看到了所有链接。找不到任何地方，我也不知道该怎么做。有人可以帮我吗？

Answer 1

带有扩展名检查的单个文件

function Upload() {
    var fileInput = document.getElementById('files');
    var filePath = fileInput.value;
    var allowedExtensions = /(\.jpg)$/;
    if (!allowedExtensions.exec(filePath)) {
        alert('this file is not allowed to upload')
        fileInput.value = '';
        return false;
    }
    var formData = new FormData(this);
    $.ajax({
        url: '/AjaxFileUpload/UploadFiles',
        type: 'POST',
        data: formData,
        success: function (data) {
            //Success Message
        },
        error: function (xhr, status, error) {
            if (status === "timeout") {
                alert(msg_timeout);
            } else {
                alert(msg_error);
            }
        },
        cache: false,
        contentType: false,
        processData: false
    });
});

有关多文件上传，请参阅以下链接

https://www.yogihosting.com/jquery-file-upload/

点击功能上传文件

1 个答案: