0

我想通过使用多部分/表单数据的 RestEasy 服务使用 Jquery 上传 Excel 文件。无论我想使用 Ajax 进行文件上传还是简单的 Jquery/Javascript 都足够了。如果我只想使用 Ajax 方式，我必须发布什么样的内容类型才能上传？

这是我的 HTML 和 Jquery 代码。

<script type="Javascript">
    $(document).ready(function () {
        //var filename = document.getElementById("uploadedFile").value;
        var filename = $("#uploadedFile").val();
        //alert(filename);
        jQuery("#Upload").click(function () {
            $.ajax({
                url: 'service url',
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                // enctype: 'multipart/form-data',
                data: {
                    file: filename
                },
                cache: false,
                success: function (data) {
                    alert('success');
                    return false;
                },
                error: function (data, status) {
                    alert("failue");
                    alert(status);
                }
            });
        });
    });
</script>

<input type="file"  name="uploadedFile" id="uploadedFile" size="30" ><br><br>
<input type="button" id="Upload" name="Upload" value="Upload"  style="width:72px;height:23px;">
4

5 回答 5

1

如果您使用的是 HTML5，这应该很容易。

这就是我上传文件的方式

HTML,

<form method="POST" enctype="multipart/form-data"
      action="/file/upload" style="display: none">
      <input type="file" name="file"  multiple="multiple" id="uploadImages">
</form>

JS,

$('#uploadImages').on('change', function (){
            var formData = new FormData();
            for(var i = 0; i < this.files.length; i++){
                formData.append('file', this.files[i]);

                $.ajax({
                    url : '/file/upload',
                    type : 'post',
                    data : formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    success : function () {
                        alert("upload successfully")
                    }
                })

            }
        }
        $('form')[0].reset();
    })
于 2017-04-01T03:22:13.467 回答
1

您可以通过 jQuery 和 HTML 来完成它。参考下面的编码。它是 HTML 格式的。

HTML

<form id="" enctype="multipart/form-data" method="POST" name=""
      action='URL.do'>
    <table width="100%" height="0" border="0" style="border-collapse: collapse" cellpadding="0" cellspacing="0">
        <tr>
            <td>Select File to Upload&nbsp;</td>
            <td valign="top" colspan="3">
                <input type="file" name="excelFile" id="excelFile"
                       accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet">
            </td>
        </tr>

        <tr>
            <td align="left">

                <input type="submit" class="buttons" onclick=""
                       id="btnUpload" name="btnUpload" value="Submit"/>
            </td>
        </tr>

    </table>

</form>
于 2018-05-16T12:05:50.147 回答
0

使用 ajaxfileupload.js 我已经使用它完成了多个文件上传，它是一个很棒的 js 库，您将完全控制您的上传！

https://code.google.com/p/my-web-js/downloads/detail?name=ajaxfileupload.js&can=2&q=

http://www.phpletter.com/Our-Projects/AjaxFileUpload/

于 2013-04-10T13:13:14.863 回答
0

如果您想在不使用 JS 和回退的任何页面重新加载的情况下上传，可以使用http://www.uploadify.com/或http://www.plupload.com/

我测试并验证了他们两个:)

于 2013-04-10T10:02:53.167 回答
0

您可以使用XMLHttpRequest和FormData上传文件，

$('#input-file').change(function() {

      var url = '/back-end-url';
      var form_data = new FormData();
      var xhr = new XMLHttpRequest();

      $.each(this.files, function (key, value) {
          form_data.append('file', value)
      })

      xhr.open('POST', url, true)
      xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest")
      xhr.send(form_data)

      xhr.onreadystatechange(function() {
          if(xhr.readyState == XMLHttpRequest.DONE) {
               var res = JSON.parse(xhr.responseText)
          }
      })

})

您可以在后端获取和处理文件。

于 2017-12-20T10:19:03.957 回答