清空input file中的值

对于input type为file元素：

未选择文件之前，它是这个样子：

当选择文件名为index.html的文件后，它变成了这个样子，input元素会显示文件名信息：

有时候在选择上传文件时，需要前端对选择的文件格式进行一个判断，当满足条件时，才在input元素中显示其文件名信息，当不满足时则保持原来样子即显示“未选择任何文件”。由于input type为file元素默认只要选择了文件都会显示其文件名信息，所以想实现上述效果就需要在判断时对不符合条件的进行一个input file值的清空。方法如下，亲测有效：

1、value设置为空

对于input type为file元素，不能为value属性设置除空以外的值，否则会报错，如下图：

但是可以利用设置value为空来清空input file中的值。inputEle为input type为file的元素DOM。

inputEle.value = '';

因此，对于不满条件的可以通过设置value为空，让input元素不显示其文件名信息。

参考文献

[1] js清空input file的值
[2] 将input file的选择的文件清空的两种解决方案

清空input file中的值相关推荐

ajax form表单提交 input file中的文件
现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了解决这个问题我走了不少弯路: 1.用原生的 input f ...
js清除HTML的input数据,js 清空 input file 的值的方法
今天在做一个利用 JS 上传本地图片的小功能时,需要在文件上传成功后,清空 file 类型的 input 元素中所选择的本地文件,以方便二次功能的调用!而这篇文章飞鸟慕鱼博客就来说一说,如果利用 js ...
js文件上传以及js清空input file值
最近项目中遇到文件上传的案例, 之前涉及文件上传的较少, 今天针对js文件上传的案例做一个详细的教程,方便日后查阅! 本教程从原生JS, jQuery, 两处着手简单介绍文件上传案例 1.原生JS ...
js复制input 框中的值
js复制input 框中的值 function copy(){ var Url2=document.getElementById("copyValue"); Url2.select ...
html取输入框中的值,jquery获取input输入框中的值
如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值通过 ...
如何获取input输入框中的值？
如何获取input输入框中的值? 获取input输入框中值的关键是获取input的value属性. 1.javascript 通过DOM元素获取方法来获取input元素,然后访问其value属性. ...
如何通过js获取html文本框中的值,js与jquery获取input输入框中的值实例讲解
如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值通过 ...
jQuery清空input file文件域的解决方案
在对一个文件域(input type="file")使用了验证后,我们总会希望把文件域中的值给清空了(否则错误的文件仍然会被提交),而在IE中,安全设置的原因,是不允许更改文件域的 ...
【Html】清空Input file数据
不能采用 document.getElementById('testFile'),这样获取不了file的value值需要通过对象的形式获取和设置value值方法一:change事件中传入当前触发事 ...

清空input file中的值

清空input file中的值

1、value设置为空

参考文献

清空input file中的值相关推荐

最新文章

热门文章