一个页面上实现多个入口每个都可以上传多个文件
时间: 2024-05-09 10:16:36 浏览: 7
您可以使用HTML的<input type="file">元素来实现文件上传的功能,建议为每个入口单独设置一个<input type="file">元素。您可以使用JavaScript来处理多个文件上传的情况。以下是一个简单的示例代码:
HTML:
```html
<form>
<h2>入口1</h2>
<input type="file" name="file1" multiple>
<br>
<h2>入口2</h2>
<input type="file" name="file2" multiple>
<br>
<button type="submit">上传</button>
</form>
```
JavaScript:
```javascript
const form = document.querySelector('form');
form.addEventListener('submit', (event) => {
event.preventDefault();
const formData = new FormData(form);
const entries = formData.entries();
for (const [name, file] of entries) {
console.log(`上传${name}文件: ${file.name}`);
// 在这里处理上传文件的逻辑
}
});
```
在上面的示例中,我们使用了FormData对象来收集表单数据,并使用entries()方法来遍历所有上传的文件。您可以在for循环中执行自己的上传文件逻辑。