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

 更新时间:2014年09月02日 15:39:15   投稿:shichen2014  
这篇文章主要介绍了JavaScript判断文件上传类型的方法,可实现针对重复的内容也能触发onchange事件,需要的朋友可以参考下

本文实例展示了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把局部变量变成全局变量的方法

    这篇文章主要介绍了JavaScript把局部变量变成全局变量的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • js常用的继承--组合式继承

    js常用的继承--组合式继承

    本篇文章主要介绍了js常用的继承--组合式继承的相关知识,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • jQuery NProgress.js加载进度插件的简单使用方法

    jQuery NProgress.js加载进度插件的简单使用方法

    NProgress是基于jquery的,且版本要 >1.8 。这篇文章主要介绍了NProgress.js加载进度插件的简单使用方法,需要的朋友可以参考下
    2018-01-01
  • js实现简单的可切换选项卡效果

    js实现简单的可切换选项卡效果

    这篇文章主要介绍了js实现简单的可切换选项卡效果的方法,涉及javascript操作css样式实现切换选项卡的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • JS字符串转换为数组的4 个方法示例小结

    JS字符串转换为数组的4 个方法示例小结

    这篇文章主要介绍了JS字符串转换为数组的4 个方法示例小结,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2023-12-12
  • JS实现标签页切换效果

    JS实现标签页切换效果

    这篇文章主要为大家详细介绍了JS实现标签页切换效果的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05
  • 详解JSON.stringify()的5个秘密特性

    详解JSON.stringify()的5个秘密特性

    这篇文章主要介绍了详解JSON.stringify()的5个秘密特性,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • js截取固定长度的中英文字符的简单实例

    js截取固定长度的中英文字符的简单实例

    下面是自己写的一个简单的函数,用于截取固定长度的字符串,中英文都适用.若有不妥之处还请高手指正
    2013-11-11
  • JS使用new操作符创建对象的方法分析

    JS使用new操作符创建对象的方法分析

    这篇文章主要介绍了JS使用new操作符创建对象的方法,结合实例形式分析了javascript面向对象程序设计类的定义、new操作符对象的创建及相关操作注意事项,需要的朋友可以参考下
    2019-05-05
  • 在uniapp中如何去掉一些不想要的权限

    在uniapp中如何去掉一些不想要的权限

    在uniapp中,云打包以后会自动增加一个电话权限,并且在manifest.json里面也没有添加这个权限,怎么添加都添加不上,下面小编给大家分享在uniapp中如何去掉一些不想要的权限,感兴趣的朋友跟随小编一起看看吧
    2024-03-03

最新评论