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 相关文章推荐
jquery imgareaselect 使用利用js与程序结合实现图片剪切
Jul 30 Javascript
Jquery知识点二 jquery下对数组的操作
Jan 15 Javascript
关于安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
May 17 Javascript
JS中使用变量保存arguments对象的方法
Jun 03 Javascript
浅谈jQuery中的checkbox问题
Aug 10 Javascript
jquery 实现回车登录详解及实例代码
Oct 23 Javascript
浅谈regExp的test方法取得的值变化的原因及处理方法
Mar 01 Javascript
Vue非父子组件通信详解
Jun 12 Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 Javascript
基于Bootstrap table组件实现多层表头的实例代码
Sep 07 Javascript
Angular2之二级路由详解
Aug 31 Javascript
vue-cli项目无法用本机IP访问的解决方法
Sep 20 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中url传递中文字符,特殊危险字符的解决方法
2013/08/17 PHP
腾讯QQ微博API接口获取微博内容
2013/10/30 PHP
PHP程序漏洞产生的原因分析与防范方法说明
2014/03/06 PHP
destoon切换城市后实现logo旁边显示地区名称的方法
2014/08/21 PHP
php使用str_replace实现输入框回车替换br的方法
2014/11/24 PHP
PHP7正式版测试,性能惊艳!
2015/12/08 PHP
php的常量和变量实例详解
2017/06/27 PHP
fromCharCode和charCodeAt 方法
2006/12/27 Javascript
jQuery学习总结之元素的相对定位和选择器(持续更新)
2011/04/26 Javascript
关于jQuery UI 使用心得及技巧
2012/10/10 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
2014/06/01 Javascript
JavaScript简介
2015/02/15 Javascript
js判断子窗体是否关闭的方法
2015/08/11 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
jquery带有索引按钮且自动轮播切换特效代码分享
2015/09/15 Javascript
jQuery滚动加载图片实现原理
2015/12/14 Javascript
js倒计时简单实现方法
2015/12/17 Javascript
JQuery遍历元素的后代和同胞实现方法
2016/09/18 Javascript
angularjs 表单密码验证自定义指令实现代码
2016/10/27 Javascript
vue将单页面改造成多页面应用的方法
2018/11/25 Javascript
vue+element实现表格新增、编辑、删除功能
2019/05/28 Javascript
electron实现静默打印的示例代码
2019/08/12 Javascript
vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题
2020/07/31 Javascript
python 对类的成员函数开启线程的方法
2019/01/22 Python
Python shutil模块用法实例分析
2019/10/02 Python
Python实现投影法分割图像示例(二)
2020/01/17 Python
意大利奢侈品购物网站:Giglio
2018/01/05 全球购物
Converse匡威法国官网:美国著名帆布鞋品牌
2018/12/05 全球购物
银行实习鉴定
2013/12/13 职场文书
数学系毕业生的自我评价
2014/01/10 职场文书
大四毕业生自荐书
2014/07/05 职场文书
社区精神文明建设汇报材料
2014/08/17 职场文书
医者仁心观后感
2015/06/17 职场文书
就业指导讲座心得体会
2016/01/15 职场文书
公文写作:教你写“建议书”
2019/05/07 职场文书
QT连接MYSQL数据库的详细步骤
2021/07/07 MySQL