如何在HTML与JS中按用户选择顺序打印多文件文件名

你的代码存在变量名混用的错误，同时要明确：浏览器返回的FileList对象本身是严格按照用户选择文件的顺序存储的，只要修正代码逻辑就能实现需求。

修正后的完整代码 #

<input type="file" name="filess[]" id="file" accept=".pdf" multiple="multiple" />
<script>
document.getElementById('file').addEventListener('change', function(event) {
  // 获取按选择顺序排列的文件列表
  const files = event.target.files;
  // 遍历列表，按顺序输出文件名
  for (let k = 0; k < files.length; k++) {
    // 若需去掉.pdf后缀，用replace处理；不需要则直接用files[k].name
    const fileName = files[k].name.replace(/\.pdf$/i, '');
    console.log(fileName);
  }
});
</script>

关键说明 #

• 变量统一：原代码混用filess、files、file等变量导致逻辑混乱，修正后统一用files指代文件列表，避免遍历错误。
• 顺序保障：event.target.files返回的FileList天然保留用户选择文件的顺序，无需额外排序操作。
• 后缀处理：用正则/\.pdf$/i可以更严谨地去掉文件名末尾的.pdf后缀（不区分大小写），如果不需要去除后缀，直接输出files[k].name即可。

内容的提问来源于stack exchange，提问作者Noizy Z