获取 JavaScript 中的文件扩展名

Question

我在检查多个输入文件的扩展名时遇到问题。我在 javascript 中添加了 pathinfo 并提醒检查文件扩展名，但无法工作。以下是我的编码：

<!DOCTYPE html>
<html>
<body>



<input type="file" name="vasplus_multiple_files" id="vasplus_multiple_files"   accept="application/msword, application/pdf, application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/*" multiple="multiple"/>
    <input type="submit" name="next" class="action-button" value="Submit" onclick="sendFunc_web()"/> 
<script>
function sendFunc_web(){
                var inp = document.getElementById('vasplus_multiple_files');
                var count = inp.files.length;
                for (var i = 0; i < inp.files.length; ++i) {
                    var num = i+1;
                    var name = inp.files.item(i).name;      
                    var ext = pathinfo(name, PATHINFO_EXTENSION);   
                     alert("here is a file path: " + ext);
                                
                }

        }
</script>

</body>
</html>

例如，如果文件名为 abcdefg.pdf 和 haha.jpeg，我想提醒两次数据以显示扩展名 pdf 和 jpeg``。

结果可能如下图所示；

希望有人能指导我哪里错了。

Answer 1

尝试使用以下解决方案

function sendFunc_web() {
  var inp = document.getElementById('vasplus_multiple_files');
  var count = inp.files.length;
  for (var i = 0; i < inp.files.length; ++i) {
    var num = i + 1;
    var name = inp.files.item(i).name;
    var ext = name.split('.');
    ext = ext[ext.length - 1];
    alert("here is a file path: " + ext);
  }
}

<input type="file" name="vasplus_multiple_files" id="vasplus_multiple_files" accept="application/msword, application/pdf, application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/*" multiple="multiple" />
<input type="submit" name="next" class="action-button" value="Submit" onclick="sendFunc_web()" />

Answer 2

您可以用点分割名称文件，并访问最后一个索引：

function sendFunc_web() {
  var inp = document.getElementById('vasplus_multiple_files');
  var count = inp.files.length;
  for (var i = 0; i < inp.files.length; ++i) {
    var num = i + 1;
    var name = inp.files.item(i).name;
    console.log(name)
    let ext = ext[ext.length - 1]
    console.log(ext)
  }
}

Answer 3

pathInfo 的正则表达式（快速且准确）版本：

function pathInfo(s) {
    s=s.match(/(.*?\/)?(([^/]*?)(\.[^/.]+?)?)(?:[?#].*)?$/);
    return {path:s[1],file:s[2],name:s[3],ext:s[4]};
}
var sample='folder/myfolder/another/file.min.js?query=1';
var result=pathInfo(sample);
console.log(result);
/*
{
  "path": "folder/myfolder/another/",
  "file": "file.min.js",
  "name": "file.min",
  "ext": ".js"
}
*/
console.log(result.ext);

获取 JavaScript 中的文件扩展名

Get the file extension in the JavaScript

javascript

file-extension

file