位置: 编程技术 - 正文

原生JavaScript实现异步多文件上传(原生js实现ajax步骤)

编辑:rootadmin

推荐整理分享原生JavaScript实现异步多文件上传(原生js实现ajax步骤),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:原生js实现promise.all,原生js import,原生js实现promise.all,原生js import,原生js实现ajax步骤,原生js实现promise.all,原生js实现promise,原生js常用的方法,内容如对您有帮助,希望把文章链接给更多的朋友!

这是在上篇的修改版本。后台代码不变就可以接着使用,但是脚本不再使用jQuery了,改为原生的JavaScript 代码,所以我们主要看JS代码。

先介绍一下技术参数:

页面技术:HTML5

后台技术:Servlet 3.0

服务器:Tomcat 7.0

脚本:JavaScript

HTML5 file组件的新属性

accept : 如果在file组件中增加这个属性就可以直接控制上传的文件类型了,实在是很方便。

原生JavaScript实现异步多文件上传(原生js实现ajax步骤)

multiple:是否允许选择多个文件HTML5 页面代码修改后

accept 的值可以参阅:IANA MIME 类型(标准 MIME 类型的完整列表),如果使用的是DW开发的话,软件本身就有提示。

如果选择了多个文件,可以用JS做循环打印,看看文件的名称,类型和大小,看演示代码

既然可以循环多文件的话,就可以尝试多文件上传了。

1、首先创建 XMLHttpRequest 对象

//这是全局变量。因为是示例,所以就没有判断浏览器类型,低版本IE这么写的话会出问题的var xhr = new XMLHttpRequest()2、上篇介绍了进度事件(Progress) , 这次实现 progress 和 error 2个事件

error:在请求发生错误时触发。

   对应上传时发生错误导致的上传失败:uploadFailed()

最后就是上传方法了,注意上面的html代码中上传用的方法也需要改成这个uploadFile()方法才能正常使用。

PS: 这毕竟只是基本功能的演示示例,离公司使用的要求还相差十万八千里,请谨慎在公司平台使用。

大家可以结合这篇文章进行学习:基于HTML5 Ajax文件上传进度条如何实现(jquery版本)

标签: 原生js实现ajax步骤

本文链接地址:https://www.jiuchutong.com/biancheng/387070.html 转载请保留说明!

上一篇:JavaScript使用DeviceOne开发实战(三)仿微信应用(js如何使用)

下一篇:整理Javascript事件响应学习笔记

  • 小规模企业所得税计算
  • 收到货款发货了没开发票怎么入账
  • 商贸公司成本大吗
  • 其他应收款增加银行存款减少的原因
  • 蔬菜开税票纳税吗
  • 本年已交税费怎么算
  • 厂区打地坪会计怎么做账
  • 金税盘开具电子发票后如何保存电子版
  • 想要自己开厂应该怎么做
  • 非居民企业股权转让所得税
  • 房屋出租需要缴纳个人所得税吗
  • 专票红冲后还需重新开票吗
  • 工程款发票开给委托方要如何处理?
  • 甲供材项目施工方怎样开票
  • 对公账户分为一般户和基本户
  • 增值税发票抵扣进项税什么意思
  • 票据转让后本公司还有责任吗
  • 合作社开具的免税普票计算抵扣
  • 替票是什么和发票的区别
  • 工资结算天数
  • 民办非企业单位和私营单位的区别
  • 政府性基金收入来源三种
  • 小米手环2支持nfc功能?
  • windows11邮件
  • 缴纳印花税和残值的比例
  • 工资薪金与劳务报酬的区别有哪些
  • u盘中毒症状
  • mac本host文件
  • infotainment.exe
  • 公司赚的钱要交税吗?交多少?
  • blender不支持win7
  • 国家税务总局关于个人因解除劳动合同
  • 盈余公积转增资本对会计要素的影响
  • sysmon安装
  • elipse左侧菜单栏显示
  • 增值税纳税申报表附列资料(一)
  • notion all in one
  • 微信支付开发包
  • 网络命令traceroute
  • 固定资产清理借方增加还是减少
  • 不免征个人所得税的是个人转让著作权所得
  • 织梦cms不更新了吗
  • 帝国cms8.0
  • 存货资产减值损失借贷方向
  • 终止合约取得的合约
  • 权益工具是金融资产还是非金融资产
  • 资产减值损失属于
  • 常用sql脚本
  • 应计入应付款项的科目
  • 小公司财务做内账流程
  • 福利费需要通过应付职工薪酬吗
  • 取得抵债资产
  • 商业承兑汇票托收什么意思
  • 企业应收票据到期怎么办
  • 无形资产减值准备
  • 小规模纳税人增值税账务处理
  • 住房贷款利息专项附加扣除怎么用
  • 小规模纳税人收到专票的会计分录
  • sql server 3417错误
  • sqlserver 附加数据库 只读
  • win10右键菜单自定义
  • mac如何设置默认打开程序
  • linux系统故障及解决方法
  • docker mysql 数据存储容器目录
  • wrsvn.exe是什么
  • windows7如何设置电脑不待机
  • windows10mode
  • linux系统的
  • 显示隐藏文件也看不到
  • win7第三方更新
  • win8系统ie浏览器最高多少
  • android游戏编程之从零开始
  • javascript的引用类型
  • python中__init__
  • 一个绿色的球英语怎么读
  • 城管大队长级别高吗
  • 河南地方税务局税收征管档案管理办法(试行)
  • 财政部监制的发票
  • ca登录的用户名和密码分别是什么
  • 教育用地性质可以更改么
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设