JavaScript判断文件上传类型的方法


Posted in Javascript onSeptember 02, 2014

本文实例展示了JavaScript判断文件上传类型的方法,是一个非常常用的技巧。具体实现方法如下:

文件上传时用到一个功能,使用html元素的input标签实现:

<input id="imageFile" name="imageFile1" accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" type="file"   title="点击选择文件" onchange="imageSubmit(this,0);"/>

选中图片后立即触发onchange事件上传图片,但是重复选择相同的图片不会触发onchang事件,解决办法如下:

function imageSubmit(obj, imageType) { 
  if (imageType == "0") { 
  //相关处理代码... 

  //解决上传相同图片不触发onchange事件
  var nf = obj.cloneNode(true);
  nf.value=''; 
  obj.parentNode.replaceChild(nf, obj);
  }
}

cloneNode()方法用来创建调用这个节点的一个完全相同的副本,参数true表示执行深复制,也就是复制节点及整个子节点树,在参数为false的情况下,执行浅复制,即只复制节点本身。复制后返回的节点副本属于文档所有,但并没有为它指定父节点。因此,这个节点副本就成为了一个“孤儿”,除非通过appendChild()、insertBefore()或replaceChild()将它添加到文档中。

希望本文所述对大家运用javascript进行web程序设计有所帮助。

Javascript 相关文章推荐
javascript同步Import,同步调用外部js的方法
Jul 08 Javascript
JS面向对象编程详解
Mar 06 Javascript
js字符串截取函数slice、substring和substr的比较
May 17 Javascript
jQuery搜索框效果实现代码(百度关键词联想)
Feb 25 Javascript
vue2.0 资源文件assets和static的区别详解
Apr 08 Javascript
分享5个顶级的JavaScript Ajax组件库
Sep 16 Javascript
Vue实现一个图片懒加载插件
Mar 11 Javascript
vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法
Apr 17 Javascript
Vue监听滚动实现锚点定位(双向)示例
Nov 13 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
Aug 13 Javascript
vue-router懒加载的3种方式汇总
Feb 28 Vue.js
react合成事件与原生事件的相关理解
May 13 Javascript
JavaScript中九种常用排序算法
Sep 02 #Javascript
事件委托与阻止冒泡阻止其父元素事件触发
Sep 02 #Javascript
解决jquery版本冲突的有效方法
Sep 02 #Javascript
ajaxFileUpload.js插件支持多文件上传的方法
Sep 02 #Javascript
引用其它js时如何同时处理多个window.onload事件
Sep 02 #Javascript
JS中自定义定时器让它在某一时刻执行
Sep 02 #Javascript
理解javascript中的回调函数(callback)
Sep 02 #Javascript
You might like
php项目打包方法
2008/02/18 PHP
thinkPHP使用post方式查询时分页失效的解决方法
2015/12/09 PHP
PHP数组操作实例分析【添加,删除,计算,反转,排序,查找等】
2016/12/24 PHP
新页面打开实际尺寸的图片
2006/08/25 Javascript
javascript编程起步(第五课)
2007/02/27 Javascript
js function使用心得
2010/05/10 Javascript
从js向Action传中文参数出现乱码问题的解决方法
2013/12/29 Javascript
javascript判断复选框是否选中的方法
2015/10/16 Javascript
js判断上传文件后缀名是否合法
2016/01/28 Javascript
node.js 中国天气预报 简单实现
2016/06/06 Javascript
jQuery Form表单取值的方法
2017/01/11 Javascript
JS ES6多行字符串与连接字符串的表示方法
2017/04/26 Javascript
javascript简单链式调用案例分析
2017/05/10 Javascript
浅谈Vue组件及组件的注册方法
2018/08/24 Javascript
Vue中插入HTML代码的方法
2018/09/21 Javascript
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
微信小程序上传图片到php服务器的方法
2019/05/23 Javascript
微信小程序 bindtap 传参的实例代码
2020/02/21 Javascript
基于vue中的scoped坑点解说
2020/09/04 Javascript
python 利用栈和队列模拟递归的过程
2018/05/29 Python
在Pandas中给多层索引降级的方法
2018/11/16 Python
python multiprocessing模块用法及原理介绍
2019/08/20 Python
python实现飞船大战
2020/04/24 Python
canvas 实现 github404动态效果的示例代码
2017/11/15 HTML / CSS
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
家用个人磨皮机:Trophy Skin
2017/03/30 全球购物
当文件系统受到破坏时,如何检查和修复系统?
2012/03/09 面试题
新学期班主任寄语
2014/01/18 职场文书
CAD制图设计师自荐信
2014/01/29 职场文书
班长自荐书范文
2014/02/11 职场文书
《菜园里》教学反思
2014/04/17 职场文书
科技节口号
2014/06/19 职场文书
入党积极分子学习优秀共产党员先进事迹思想汇报
2014/09/13 职场文书
领导班子奢靡之风查摆问题及整改措施
2014/09/27 职场文书
个人年度总结报告
2015/03/09 职场文书
vue实现锚点定位功能
2021/06/29 Vue.js