在IE中获取上传文件的名称

Question

I have a file upload button that users click on the upload a function and when they choose the files they upload the site. 我有一个文件上传按钮，用户单击上传功能，然后在选择文件时上传站点。 This is working beautifully and perfectly. 这可以完美地工作。

However, I have come across a bug with the file name in ie.In Chrome and Firefox I am able to use the form data and grab the file name out of that. 但是，我遇到了文件名错误，即在Chrome和Firefox中，我可以使用表单数据并从中获取文件名。 But in ie, it seems to be grabbing the entire path and using that as the name. 但是在ie中，它似乎抓住了整个路径并将其用作名称。 Is there any other way to grab the file name from an uploaded file? 还有其他方法可以从上传的文件中获取文件名吗？ So that this can be consistent and truly just be the file name? 这样就可以保持一致，并且实际上只是文件名？

My code looks like this. 我的代码如下所示。

var file = $(this).prop("files")[0]; 
var form = new FormData($('input[name^="media"]'));

form.append("fileName", file.name);

The ie name for the file 文件的ie名称

C:UsersUsersNameFolderNameMoreComplicatedFolderNameFileDocumentName.docx

and in every other browser it grabs the file name as 并在所有其他浏览器中将其抓取为

FileDocumentName.docx

Answer 1

Try to pass the whole form. 尝试通过整个表格。 Something like this.. 像这样

var myForm = document.getElementByTagName('form');
var form = new FormData();

form.append("myForm", myForm);

Answer 2

This should work for you as long as you are using IE 10 and above. 只要您使用的是IE 10及更高版本，此方法就应该对您有用。 I have tested this on IE-11 and Chrome 我已经在IE-11和Chrome上测试过

<html>

<head>
    <title>Get Name of uploaded file</title>

    <script type="text/javascript">

        function fetchFileName(fileObjId) {

            var fileObj = document.getElementById(fileObjId);
            var txt = "";

            if ('files' in fileObj) {
                if (fileObj.files.length == 0) {
                    txt = "Select one or more files.";
                }
                else {
                    for(var i = 0; i < fileObj.files.length; i++) {

                        txt += "<br><strong>" + (i+1) + ". file</strong><br>";
                        var file = fileObj.files[i];

                        if ('name' in file) {
                            txt += "name: " + file.name + "<br>";
                        }
                        if ('size' in file) {
                            txt += "size: " + file.size + " bytes <br>";
                        }
                    }
                }
            }
            else {
                if(fileObj.value == "") {
                    txt += "Select one or more files.";
                }
                else {
                    txt += "The files property is not supported by your browser!";
                    txt  += "<br>The path of the selected file: " + fileObj.value;
                }
            }

            document.getElementById("demo").innerHTML = txt;

            return false;
        }

    </script>
</head>

<body>

    File to Upload: <input type="file" name="uploadFile" id="uploadFile" />&nbsp;
    <input type="button" value="Get File Name" onclick="return fetchFileName('uploadFile')" />

    <br/><br/>
    Output: <span id="demo"></span>

</body>

</html>

See this too - https://www.w3schools.com/jsref/prop_fileupload_files.asp 也请参阅-https: //www.w3schools.com/jsref/prop_fileupload_files.asp

Answer 3

In internet explorer, you get the full path instead of just the file name. 在Internet Explorer中，您可以获得完整路径，而不仅仅是文件名。

You can use this regex /[^\\/\\\\]*$/ to match the desired output. 您可以使用此正则表达式/[^\\/\\\\]*$/匹配所需的输出。 Like: 喜欢：

var file = $(this).prop("files")[0]; 
var form = new FormData($('input[name^="media"]'));

// Use the regex here to get the desired output
var file_name = file.name.match(/[^\/\\]*$/)[0];

form.append("fileName", file_name);

在IE中获取上传文件的名称

问题描述

3 个解决方案

解决方案1
0 2018-02-08 06:44:55

解决方案2
0 2018-02-12 12:26:28

解决方案3
0 2018-02-12 15:57:29

在IE中获取上传文件的名称

问题描述

3 个解决方案

解决方案1 0 2018-02-08 06:44:55

解决方案2 0 2018-02-12 12:26:28

解决方案3 0 2018-02-12 15:57:29

解决方案1
0 2018-02-08 06:44:55

解决方案2
0 2018-02-12 12:26:28

解决方案3
0 2018-02-12 15:57:29