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闭包
Dec 03 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
Jun 05 Javascript
详解Jquery的事件操作和文档操作
Dec 19 Javascript
php 修改密码实现代码
May 24 Javascript
关于使用axios的一些心得技巧分享
Jul 02 Javascript
JavaScript基础进阶之数组方法总结(推荐)
Sep 04 Javascript
JavaScript原生实现观察者模式的示例
Dec 15 Javascript
jquery根据name取得select选中的值实例(超简单)
Jan 25 jQuery
Postman的下载及安装教程详解
Oct 16 Javascript
详解Vue组件之间通信的七种方式
Apr 14 Javascript
浅谈实现在线预览PDF的几种解决办法
Aug 10 Javascript
vue3.0+vue-router+element-plus初实践
Dec 02 Vue.js
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
关于BIG5-HKSCS的解决方法
2007/03/20 PHP
PHP获取MAC地址的函数代码
2011/09/11 PHP
PHP限制页面只能在微信自带浏览器访问的代码
2014/01/15 PHP
PHP 实现公历日期与农历日期的互转换
2017/09/13 PHP
javascript实现仿银行密码输入框效果的代码
2007/12/13 Javascript
jquery阻止冒泡事件使用模拟事件
2013/09/06 Javascript
javascript页面加载完执行事件代码
2014/02/11 Javascript
js replace替换所有匹配的字符串
2014/02/13 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
2014/06/23 Javascript
Node.js文件操作详解
2014/08/16 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
2015/12/08 Javascript
jQuery bt气泡实现悬停显示及移开隐藏功能的方法
2016/07/12 Javascript
浅谈angularjs module返回对象的坑(推荐)
2016/10/21 Javascript
jQuery实现动态加载(按需加载)javascript文件的方法分析
2019/05/31 jQuery
ES6中new Function()语法及应用实例分析
2020/02/19 Javascript
跟老齐学Python之print详解
2014/09/28 Python
Python正则抓取网易新闻的方法示例
2017/04/21 Python
10分钟教你用Python实现微信自动回复功能
2018/11/28 Python
安装Pycharm2019以及配置anconda教程的方法步骤
2019/11/11 Python
python多线程使用方法实例详解
2019/12/30 Python
查看keras各种网络结构各层的名字方式
2020/06/11 Python
加拿大领先的牛仔零售商:Bluenotes
2018/01/22 全球购物
院药学专业个人求职信
2013/09/21 职场文书
大学毕业通用个人的求职信
2013/12/08 职场文书
纪念建党演讲稿范文
2014/01/13 职场文书
《李时珍夜宿古寺》教学反思
2014/04/09 职场文书
书香校园建设方案
2014/05/02 职场文书
旅游与酒店管理专业求职信
2014/07/21 职场文书
四风问题对照检查材料思想汇报
2014/10/07 职场文书
计划生育工作总结2015
2015/04/03 职场文书
党支部培养考察意见
2015/06/02 职场文书
2019年教师节祝福语精选,给老师送上真诚的祝福
2019/09/09 职场文书
一文搞懂如何实现Go 超时控制
2021/03/30 Python
pycharm debug 断点调试心得分享
2021/04/16 Python
关于使用Redisson订阅数问题
2022/01/18 Redis
详解Mysq MVCC多版本的并发控制
2022/04/29 MySQL