清空input file中的值

清空input file中的值清空inputfile中的值对于inputtype为file元素:未选择文件之前,它是这个样子:当选择文件名为index.html的文件后,它变成了这个样子,input元素会显示文件名信息:  有时候在选择上传文件时,需要前端对选择的文件格式进行一个判断,当满足条件时,才在input元素中显示其文件名信息,当不满足时则保持原来样子即显示“未选择任何文件”。由于input…


Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

清空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的选择的文件清空的两种解决方案

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/160938.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • 用c#实现简单的登录和注册功能

    用c#实现简单的登录和注册功能这两天c#大作业要求做一个简单的通讯录系统,我就先做了登录和注册的功能,在网上看了一些代码,自己再做,终于做出来了。做的不是很美观,但是可以简单实现。首先用sqlserver建表。我建了一个名为user_info的表,添加username和passdword两个字段。创建登录页面,改了一些控件的名称,效果如下图:登录界面代码如下:privatevoidbtn_Login…

    2022年8月22日
  • 【NLP】之 结巴分词

    【NLP】之 结巴分词1.结巴分词简介结巴分词是当前效果较好的一种中文分词器,支持中文简体、中文繁体分词,同时还支持自定义词库。结巴分词支持三种分词模式:精确模式、全模式和搜索引擎模式。精确模式是试图将句子最精确的进行切分,适合用于文本分析; 全模式的原理是把句子中全部可以成词的词语全部扫描出来,它的分词速度快,缺点是无法识别歧义词句; 搜索引擎模式是在精确模式的基础上进一步处理的,它对较长的词语再进…

    2022年6月17日
  • IDEA打包jar包详尽流程

    IDEA打包jar包详尽流程打包流程1.打开菜单栏File-ProjectStructure2.点击Artifacts3.点击”+”-JAR-Frommodulewithdepenencies4.后弹出如下界面,自此开始,各种问题就来了首先Module中,我SocketDemo的Module含有SocketDemo、SocketDe…

    2022年6月30日
  • 另一个视角解读计算机编码-补码编码

    另一个视角解读计算机编码-补码编码

    2022年3月11日
  • docker nginx挂载目录_挂载成功之后如何安装

    docker nginx挂载目录_挂载成功之后如何安装创建目录一般将nginx目录挂载到宿主机方便操作,创建nginx目录:mkdir/home/dockernginxmkdir/home/dockernginx/{conf,html,logs}创建nginx配置文件如下:vim/home/dockernginx/conf/nginx.confnginx默认配置如下:usernginx;worker_processesauto;error_log/var/log/nginx/error.lognotice;pi

    2022年8月20日
  • 安卓短信转发qq邮箱

    安卓短信转发qq邮箱fork一个github项目简介准备工作Tips简介最近不怎么带手机,所以收不到一些验证码什么的,所以想搞一个app放手机上将短信以有邮件的形式发送到指定邮箱,然后用电脑查看邮件,这样就可以不用带手机了。在github上找到一个项目叫sms-backup-plus,于是准备在这个项目的基础上进行更改。准备工作安装androidStudio学习kotlin怎么整合java和k…

    2022年9月25日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号