使用 jQuery 获取文件输入的选定文件名，但不包含路径

小开

这个怎么样？

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

小开

最佳答案

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

或者你可以这样做(因为出于安全考虑，总是添加 C:\fakepath) :

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

小开

一定要是 jquery 吗？或者可以只使用 JavaScript 的原生 yourpath.split("\\")将字符串分割为数组？

小开

由于安全原因，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 .

小开

也许可以增加一些防止伪路径的东西:

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

小开

我是这么做的，效果很好。

请在 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

小开

获取所有操作系统的路径工作

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

例子

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

都回来了

filename.doc
filename.doc

小开

从控件中获取第一个文件，然后获取该文件的名称，它会忽略 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;
}

小开

您只需要执行下面的代码。第一个[0]是访问 HTML 元素，第二个[0]是访问文件上传的第一个文件(我包含了一个验证，以防没有文件) :

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

小开

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

小开

<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>

小开

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

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

小开

你可以这样打电话这是我的 Input File 控件

  <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>

小开

我们也可以使用 match移除它

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