修改一下,我需要url可以自定义
时间: 2024-03-27 10:37:05 浏览: 18
好的,那么你可以将上传的 URL 作为一个 input 元素,让用户自行输入。以下是修改后的代码示例:
```html
<form id="upload-form" enctype="multipart/form-data">
<input type="file" name="file">
<input type="text" name="uploadUrl" placeholder="上传的 URL">
<button type="submit">上传文件</button>
</form>
```
```javascript
const form = document.getElementById('upload-form');
form.addEventListener('submit', (event) => {
event.preventDefault(); // 防止表单自动提交
const formData = new FormData(form); // 获取表单数据
const uploadUrl = formData.get('uploadUrl'); // 获取上传的 URL
formData.delete('uploadUrl'); // 删除上传的 URL
fetch(uploadUrl, { // 发送上传请求
method: 'POST',
body: formData
})
.then(response => {
console.log('上传成功');
})
.catch(error => {
console.error('上传失败', error);
});
});
```
在上面的代码示例中,我们添加了一个新的 input 元素,允许用户输入上传的 URL。在 JavaScript 代码中,我们使用 `formData.get('uploadUrl')` 获取上传的 URL,并在发送请求前将其从表单数据中删除,以免被一同上传。然后我们使用 `fetch` API 发送了一个 POST 请求到上传的 URL。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)