html获取file 的文件名

你可以使用JavaScript来获取input type="file"元素中选择的文件名。方法如下：

1. 获取input元素:

const fileInput = document.getElementById('fileInput');

2. 添加change事件监听器:

fileInput.addEventListener('change', function() {
  // 在这里获取文件名
});

3. 获取文件名:

const fileName = fileInput.files[0].name;
console.log(fileName);

这个方法将会在用户选择了文件后获取文件名并将其输出到控制台。

相关问题

获取 formData for file 文件名及文件

当你需要从 HTML 表单的 `FormData` 对象中获取文件上传的文件名和文件内容时，可以按照以下步骤操作：

1. **获取文件名（filename）**：
使用 `FormData` 的 `get()` 或者 `entries()` 方法来获取特定字段（通常是文件输入框的名称），然后检查它是否是一个 File 类型的值。如果存在，你可以通过 `File` 对象的 `name` 属性获取文件名。

var form = new FormData(document.getElementById('your-form-id'));
var fileName = form.get('file-input-name') || form.entries().find(entry => entry[0] === 'file-input-name')[1].value.name;

2. **获取文件内容（file content）**：
为了读取文件的内容，你需要创建一个 `FileReader` 对象并调用其 `readAsArrayBuffer()`、`readAsText()` 或 `readAsDataURL()` 方法。这取决于你想如何处理文件数据（二进制、文本还是URL）。下面是一个简单的示例，展示如何读取文件为二进制数据：

var reader = new FileReader();
reader.readAsArrayBuffer(form.get('file-input-name')); // 替换为实际文件名

reader.onload = function (event) {
    var binaryData = event.target.result;
    // 这里binaryData包含了文件的二进制数据
};

html获取文件夹所有文件名

在 HTML 中，只能通过 JavaScript 来获取文件夹中的所有文件名。可以通过以下代码实现：

function getFolderFiles() {
  var files = [];
  var input = document.createElement("input");
  input.type = "file";
  input.webkitdirectory = true;
  input.multiple = true;
  input.style.display = "none";
  
  input.addEventListener("change", function() {
    for (var i = 0; i < this.files.length; i++) {
      files.push(this.files[i].name);
    }
    console.log(files);
  });
  
  document.body.appendChild(input);
  input.click();
}

这段代码创建了一个 input 元素，并设置它的 `webkitdirectory` 属性为 true，这样就可以选择文件夹。然后添加了一个 change 事件监听器，当用户选择文件夹中的文件时，就会将文件名添加到 `files` 数组中，并输出到控制台。最后通过 `click()` 方法触发了 input 的点击事件，弹出文件选择框。