Question

我用过这个：

$('input[type=file]').val()

选择文件名，但返回完整路径，如“C：\ fakepath \ filename.doc”。 “fakepath”部分实际上就在那里 - 不确定它是否应该是，但这是我第一次使用文件上传的文件名。

如何获取文件名（filename.doc）？

Answer 1

var filename = $('input[type=file]').val().split('\\').pop();

或者您可以这样做（因为出于安全原因，它总是C:\fakepath）：

var filename = $('input[type=file]').val().replace(/C:\\fakepath\\/i, '')

Answer 2

您只需要执行以下代码即可。第一个[0]是访问HTML元素，第二个[0]是访问文件上传的第一个文件（如果没有文件，我包括验证）：

    var filename = $('input[type=file]')[0].files.length ? ('input[type=file]')[0].files[0].name : "";

Answer 3

Chrome出于安全原因返回C:\fakepath\... - 网站无法获取有关您计算机的信息，例如计算机上文件的路径。

要获取字符串的文件名部分，您可以使用split() ...

var file = path.split('\\').pop();

jsFiddle

...或regular expression ...

var file = path.match(/\\([^\\]+)$/)[1];

jsFiddle

...或lastIndexOf() ...

var file = path.substr(path.lastIndexOf('\\') + 1);

jsFiddle

Answer 4

获取所有操作系统的路径

var filename = $('input[type=file]').val().replace(/.*(\/|\\)/, '');

实施例

C:\fakepath\filename.doc 
/var/fakepath/filename.doc

两者都返回

filename.doc
filename.doc

Answer 5

我是这样做的，它运作得很好。

在HTML中执行：

<input type="file" name="Att_AttributeID" onchange="fileSelect(event)" class="inputField" />

然后在你的js文件中创建一个简单的函数：

function fileSelect(id, e){
    console.log(e.target.files[0].name);
}

如果你正在做多个文件，你也应该能够通过循环来获取列表：

e.target.files[0].name

Answer 6

也许是为了避免伪路径的一些补充：

var fileName = $('input[type=file]').val();
var clean=fileName.split('\\').pop(); // clean from C:\fakepath OR C:\fake_path 
alert('clean file name : '+ fileName);

Answer 7

这样的事情怎么样？

var pathArray = $('input[type=file]').val().split('\\');
alert(pathArray[pathArray.length - 1]);

Answer 8

它必须是jquery吗？或者您可以使用JavaScript的本机yourpath.split("\\")将字符串拆分为数组吗？

Answer 9

从控件中获取第一个文件，然后获取文件的名称，它将忽略Chrome上的文件路径，并且还将修正IE浏览器的路径。在保存文件时，您必须使用System.io.Path.GetFileName方法仅为IE浏览器获取文件名

var fileUpload    = $("#ContentPlaceHolder1_FileUpload_mediaFile").get(0); 
var files         =  fileUpload.files; 
var mediafilename = ""; 

for (var i = 0; i < files.length; i++) { 
  mediafilename = files[i].name; 
}

Answer 10

<script type="text/javascript">

    $('#upload').on('change',function(){
       // output raw value of file input
       $('#filename').html($(this).val().replace(/.*(\/|\\)/, '')); 

        // or, manipulate it further with regex etc.
        var filename = $(this).val().replace(/.*(\/|\\)/, '');
        // .. do your magic

        $('#filename').html(filename);
    });
</script>

Answer 11

var filename=location.href.substr(location.href.lastIndexOf("/")+1);
alert(filename);

Answer 12

您可以在此处拨打这样的电话让这是我的输入文件控件

  <input type="file" title="search image" id="file" name="file" onchange="show(this)"  />

现在这是我的Jquery，一旦您选择文件就会被调用

<script type="text/javascript">
    function show(input) {
        var fileName = input.files[0].name;
        alert('The file "' + fileName + '" has been selected.');               
            }

</script>

Answer 13

我们也可以使用match

将其删除

var fileName = $('input:file').val().match(/[^\\/]*$/)[0];
$('#file-name').val(fileName);

使用jQuery获取文件输入的选定文件名而不使用路径

13 个答案: