js 清空html input file的值

在做上传图片预览时,利用input onchange事件触发函数,但是type=file时,一定记得新建要清空原来的图片,因为原来的图片还存在在input里面,再选重复的图片没有change,故不会触发相应的函数,造成没有反应的现象

具体的清空input file的方法:

<input type="file" accept="image/jpeg,image/png,image/gif" name="img" id="img" multiple value="Insert Image" onchange="javascript:setImagePreview();" style="position:absolute;clip:rect(0 0 0 0);">

// 清空input file文件jq
	var file = $(‘#img‘)[0];
	if(file.outerHTML){
		file.outerHTML = file.outerHTML;
	}else{
		file.value = ‘‘;
	}
// 清空input file文件原生js
    var file = document.getElementById("img");
     // for IE, Opera, Safari, Chrome
     if (file.outerHTML) {
         file.outerHTML = file.outerHTML;
     } else { // FF(包括3.5)
         file.value = "";
     }

  

原文地址:https://www.cnblogs.com/xhliang/p/9627452.html

时间: 2024-10-28 14:01:44

js 清空html input file的值的相关文章

清空input file 的值

// 清空file inputvar Upload = { clear: function(id){ var up = (typeof id=="string")?document.getElementById(id):id; if (typeof up != "object") return null; var tt = document.createElement("span"); tt.id = "__tt__"; up

Jquery 清空input file的值

var file = $(obj).parent().find(".fileData");                $(file).val('');

以input=file方式,获取文件时,在IE下8无法通过某个按钮click事件间接触发input=file的change事件

最近在项目中遇到了许多上传问题,公司内部的组件,通过form上传,需要使用input=file触发选择文件, 因为input=file在各个浏览器中显示的样式是不同的,谷歌,火狐,IE都有所不同,而且不太美观,所以为了解决 这一个问题,一开始采用了隐藏input=file 然后通过一个显示的button间接触发input=file的click事件如下 <input type="file" id="upload" style="display:none

input file 美化及上传本地预览

效果: /*input file 美化及上传本地预览,兼容IE6-8,FIrefox, Chrome(需在服务端,本地无效)*/<!DOCTYPE html><html><head>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    <title>input file 美化</title>    &

如何解决input file 选取相同文件后,change事件不起作用解决方法

两种方法 1.在你的input所属的form表单reset()就可以了! $("#avatorForm")[0].reset(); 2.设置你的input file value值为空 $('.inputImage').val('');

使用js清空input file上传文件的内容

html页面代码如下: <input id="file_input" type="file" onchange="upLoadFile(this)" value="" />js的代码如下,可以直接将上传文件input按钮的内容直接清空: var obj=document.getElementById('file_input');obj.outerHTML=obj.outerHTML; ---------------

用Javascript清空(重置)文件类型的INPUT元素的值

之前在StackOverflow回答了这个问题,现在整理到Blog里. 因为安全限制,脚本是不能随意设置其value值的,所以并不能像其它表单输入域那样用属性来设置使其重置. 重置一个文件域的值,归纳起来主要有 3 种方法. 本文分析这三种方法的浏览器兼容性以及优缺点,并给出一个比较完美的综合方案的代码和Demo. 重置文件域的三种方法: 设置value属性为空. 对于IE11以上和其它较新的非IE的现代浏览器Chrome/Firefox/Opera...有效. 克隆或创建一个新的文件输入元素进

JS动态生成Input文本框 并获取文本框值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns= "http://www.w3.org/1999/xhtml" > <head> <meta http-equiv= "Conte

input file 文件上传,js控制上传文件的大小和格式

文件上传一般是用jquery的uploadify,比较好用.后面会出文章介绍uploadify这个插件. 但是,有时候为了偷懒,直接就用input 的file进行文件和图片等的上传,input file 可以控制上传的格式,但是是html5,很多浏览器不支持,请看我的文章对input file上传类型的控制. 下面我用javascript来控制文件上传的大小和类型. 贴出html代码: <form action="后端接口" enctype="multipart/for