怎么用jquery+ajax实现多文件上传进度条

这篇文章主要讲解了"怎么用jquery+ajax实现多文件上传进度条"，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习"怎么用jquery+ajax实现多文件上传进度条"吧！

效果图

前端代码，基于jquery

                    
        
          
            
名称
            
大小
            
进度
            
结果
          
        
        
                  
      
     

后端代码，nodejs+express

const multiparty = require('multiparty');  var fs =require("fs"); router.post('/api/file', function(req, res, next) {  //生成multiparty对象，并配置上传目标路径  const form = new multiparty.Form()  // //设置编辑  form.encoding = 'utf-8'  // //设置文件存储路径  form.uploadDir = "./public/static/files/"  // //设置单文件大小限制  //form.maxFilesSize = 2 * 1024 * 1024  // form.maxFields = 1000; 设置所以文件的大小总和  // 上传完成后处理  form.parse(req, (err, fields, files) => {   if (err) {    console.log("parse:",err);    res.json({"success":"error"});   } else {    const inputFile = files.file[0];    const uploadedPath = inputFile.path    const imgtype = inputFile.originalFilename;    const inPath = `./public/static/files/${imgtype}`; //重命名的路径    // 判断是否存在./dist/static/files文件    fs.stat('./public/static/files', (err, stats) => {     if (JSON.stringify(stats) === undefined) {      fs.mkdirSync('./public/static', 0777)      fs.mkdirSync('./public/static/files', 0777)     }     storeFiles(uploadedPath, fields, inPath)    });   }  });     function storeFiles(uploadedPath, fields, inPath) {   //重命名为真实文件名   fs.rename(uploadedPath, inPath, (err) => {    if (err) {      console.log("rename:",err);      res.json({"success":"error"});    } else {          res.json({"success":"hahha"});    }   });  }});

感谢各位的阅读，以上就是"怎么用jquery+ajax实现多文件上传进度条"的内容了，经过本文的学习后，相信大家对怎么用jquery+ajax实现多文件上传进度条这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是，小编将为大家推送更多相关知识点的文章，欢迎关注！