用js写文件上传的前端代码怎么写？_JavaScript_论坛

用js写文件上传的前端代码怎么写？

黑***枯分类：JavaScript 人气：1113 回帖：2 发布于6年前收藏

<n3-uploader class="file" url="/lessonersapi/resource/uploadResourceFile" :accept="fileFormat" :params="fileName" :multiple="false" @success="addfile" @error="errorHint"></n3-uploader>

这是用n3-compontents插件的文件上传写的，在chrome和firefox都可以用，但在IE11上就不生效了，请问改成原生的要怎么改，第一次写，求大神指教！！！

标签：html html5 javascript

讨论这个帖子（2）垃圾回帖将一律封号处理……

Lv3 码奴

gu***di 软件测试工程师 6年前#1

以前写的一个例子

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>使用 FileReader 上传文件</title>
</head>
<body>
    <input id="fileInput" type="file" />
    <button id="btn" type="button">上传文件</button>
    <script>
        const fileInput = document.querySelector('#fileInput');
        const btn = document.querySelector('#btn');
        fileInput.addEventListener('change', function (e) {
            console.log(e);
            const file = e.target.files[0];
            // 可以获取上传的文件详细信息
            console.log(file);
            const formData = new FormData();
            formData.append("fileName", "photo.png");
             
            const xhr = new XMLHttpRequest();
            // 假设上传文件的接口叫 /upload
            xhr.open("POST", "/upload");
            xhr.send(formData);
        });
    </script>
</body>
</html>

参考

https://fed.renren.com/2017/1...

Lv6 码匠

街***铃 JS工程师 6年前#2

你这种描述有问题把

像这种绑定数据方法都是插件内部封装好的你怎么在这基础上改原生

你要需要原生那就重新写用 input type为file上传file文件流或其他形式来做文件上传

文明上网，理性发言！ 😉 阿里云幸运券，戳我领取