javascript - 仅通过 Html 文件输入接受 csv 文件

Question

下面给出了 Html 文件输入标签，它只接受 .csv 文件。

<input id="csvFileInput" type="file" accept=".csv"/>

这很完美。但我的情况是..

在文件选择器窗口中，用户可以选择“所有类型”而不是“.csv 文件”。 然后用户可以选择任何文件类型。 我该如何处理这种情况？

我可以处理仅更改 Html 标记吗？还是要实现的另一种 Javascript 策略？

谢谢， 最好的问候..

Answer 1

您可以添加验证 onchange 验证文件扩展名。

虽然在 html 中输入类型接受 .png 但在 js 中正则表达式失败，因为它被设计为只接受 csv。您可以修改 html 以仅接受 csv

var regex = new RegExp("(.*?)\.(csv)$");

function triggerValidation(el) {
  if (!(regex.test(el.value.toLowerCase()))) {
    el.value = '';
    alert('Please select correct file format');
  }
}

<input id="csvFileInput" type="file" accept=".png" onchange='triggerValidation(this)'>