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

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.

......或正则表达式 ......

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

这个选择似乎是最合适的。

$('input[type="file"]').change(function(e){
        var fileName = e.target.files[0].name;
        alert('The file "' + fileName +  '" has been selected.');
});

Answer 8

这样的事怎么样？

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