html input 批量上传文件删除某个文件

要实现在HTML input 批量上传文件中删除某个文件，您可以使用JavaScript来实现。以下是一个简单的示例：

首先，您需要在HTML中添加一个文件输入框、一个文件列表和一个删除按钮：

<input type="file" id="file-input" multiple>
<ul id="file-list"></ul>
<button id="delete-button">删除</button>

然后，您需要使用JavaScript来处理上传和删除操作：

// 获取文件输入框、文件列表和删除按钮
const fileInput = document.getElementById('file-input');
const fileList = document.getElementById('file-list');
const deleteButton = document.getElementById('delete-button');

// 定义文件数组
let files = [];

// 监听文件输入框的change事件
fileInput.addEventListener('change', () => {
  // 获取选择的文件
  const newFiles = Array.from(fileInput.files);

  // 将新文件添加到文件数组中
  files = files.concat(newFiles);

  // 更新文件列表
  fileList.innerHTML = files.map(file => `<li>${file.name}</li>`).join('');
});

// 监听删除按钮的click事件
deleteButton.addEventListener('click', () => {
  // 获取选中的文件
  const selectedFiles = Array.from(fileList.querySelectorAll('li.selected')).map(li => li.textContent);

  // 从文件数组中移除选中的文件
  files = files.filter(file => !selectedFiles.includes(file.name));

  // 更新文件列表
  fileList.innerHTML = files.map(file => `<li>${file.name}</li>`).join('');
});

// 监听文件列表的click事件
fileList.addEventListener('click', event => {
  // 如果点击的是li元素，则切换选中状态
  if (event.target.tagName === 'LI') {
    event.target.classList.toggle('selected');
  }
});

在这个示例中，我们首先定义一个文件数组来存储选择的文件。在文件输入框的change事件中，我们将新文件添加到文件数组中，并更新文件列表。在删除按钮的click事件中，我们获取选中的文件并从文件数组中移除，然后更新文件列表。在文件列表的click事件中，我们切换选中状态。您可以根据自己的需求修改这个示例，比如添加上传按钮和上传函数等等。