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的几种方法小结
Apr 25 Javascript
js 火狐下取本地路径实现思路
Apr 02 Javascript
js中关于一个分号的崩溃示例
Nov 11 Javascript
全系IE支持Bootstrap的解决方法
Oct 19 Javascript
jquery实现模拟百分比进度条渐变效果代码
Oct 29 Javascript
深入理解MVC中的时间js格式化
May 19 Javascript
jQuery插件实现文件上传功能(支持拖拽)
Aug 27 Javascript
JS控制FileUpload的上传文件类型实例代码
Oct 07 Javascript
简单谈谈ES6的六个小特性
Nov 18 Javascript
vue将时间戳转换成自定义时间格式的方法
Mar 02 Javascript
JQuery使用数组遍历跳出each循环
Sep 01 jQuery
ant design vue的form表单取值方法
Jun 01 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
用PHP为SHOPEX增加日志功能代码
2010/07/02 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
PHP实现文件上传与下载实例与总结
2016/03/13 PHP
使用JavaScript创建新样式表和新样式规则
2016/06/14 PHP
实例讲解通过​PHP创建数据库
2019/01/20 PHP
JavaScript Tips 使用DocumentFragment加快DOM渲染速度
2010/06/28 Javascript
javascript日期转换 时间戳转日期格式
2011/11/05 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
2013/02/26 Javascript
js 弹出框只弹一次(二次修改之后的)
2013/11/26 Javascript
nodejs之请求路由概述
2014/07/05 NodeJs
原生javascript实现DIV拖拽并计算重复面积
2015/01/02 Javascript
javascript for-in有序遍历json数据并探讨各个浏览器差异
2015/11/30 Javascript
浅谈几种常用的JS类定义方法
2016/06/08 Javascript
基于jQuery实现弹出可关闭遮罩提示框实例代码
2016/07/18 Javascript
js实现自定义路由
2017/02/04 Javascript
flag和jq on 的绑定多个对象和方法(必看)
2017/02/27 Javascript
Bootstrap 3浏览器兼容性问题及解决方案
2017/04/11 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
2019/12/06 Javascript
基于javascript原生判断DOM是否加载完毕
2020/10/14 Javascript
[01:09:40]Newbee vs Pain 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python实现字符串格式化的方法小结
2017/02/20 Python
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
Python线性拟合实现函数与用法示例
2018/12/13 Python
python去重,一个由dict组成的list的去重示例
2019/01/21 Python
解决Python import docx出错DLL load failed的问题
2020/02/13 Python
pytorch随机采样操作SubsetRandomSampler()
2020/07/07 Python
python中@property的作用和getter setter的解释
2020/12/22 Python
使用Python+Appuim 清理微信的方法
2021/01/26 Python
css3的transform造成z-index无效解决方案
2014/12/04 HTML / CSS
CPB肌肤之钥美国官网:Clé de Peau Beauté
2017/09/05 全球购物
瑜伽灵感珠宝:Satya Jewelry
2018/01/06 全球购物
护士毕业生自我鉴定
2014/02/08 职场文书
2014年“世界无车日”活动方案
2014/09/21 职场文书
教师三严三实对照检查材料
2014/09/25 职场文书
工地材料员岗位职责
2015/04/11 职场文书
Java数组与堆栈相关知识总结
2021/06/29 Java/Android