[JS] 如何清空file input框 [整理]

时间:2022-12-19 08:41:03

测试环境:
OS --> winXP
Browsers --> IE6+, FF 3.0.11, FF 3.5, Opera 9.64, Opera 10 beta 2, Safari 4, Chrome 2.0.172

xhtml:
<input type="file" value="选择文件" id="fileInput" />
<button type="button" id="btnClear">清空文件域</button>

JS:
<script type="text/javascript">
     var btn = document.getElementById("btnClear");
     var file = document.getElementById("fileInput");
     btn.onclick = function() {
         // for IE, Opera, Safari, Chrome
         if (file.outerHTML) {
             file.outerHTML = file.outerHTML;
         } else { // FF(包括3.5)
             file.value = "";
         }
    }
</script>

[JS] 如何清空file input框 [整理]的更多相关文章

  1. 清空file input框

    测试环境:OS --> winXPBrowsers --> IE6+, FF 3.0.11, FF 3.5, Opera 9.64, Opera 10 beta 2, Safari 4, ...

  2. 利用原生JS实时监听input框输入值

    传送门https://www.cnblogs.com/lantinggumo/p/7636715.html 传送门https://www.cnblogs.com/nailc/p/8572226.htm ...

  3. 小实例---关于input宽度自适应以及多个input框合并拆分

    前两个月,公司内部需要开发关于大数据方面的辅助工具语料分词系统,在这个项目中遇到以下几个主要问题,在此分享~ 一.input宽度根据内定文本宽度自适应 背景:项目需求中,前台展示,需要从后台获取的.t ...

  4. js&sol;jquery 获取本地文件的文件路劲 获取input框中type&equals;&OpenCurlyQuote;file’ 中的文件路径&lpar;转载&rpar;

     原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...

  5. 类似input框内最右边添加图标,有清空功能

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  6. file类型input框设置上传相同文件,并都可以触发change事件。

    在使用file类型input框是,删除了第一次上传到文件,再次上传相同文件,无法触发change事件,所以在删除的js上添加如下js代码: document.getElementById('fileU ...

  7. js—input框中输入数字,动态生成内容的方法

    项目中需要在前端实现: 用户输入数字n,动态生成n个元素,删除n,自动清空n个元素(如图一): 用户输入数字n,失焦生成n个元素,再聚焦修改n,自动清空n个元素(如图二): 图一: 图二: 需求一实现 ...

  8. 百度小程序-form表单点击提交&comma;input框内容不会清空

    百度小程序与微信小程序相似度90%.微信小程序转换为百度小程序,部分还是需要人工修改! 做了一个form留言表单,点击提交之后,input框第一次会清空,但是第二次就不会清空了! 不多说直接上代码! ...

  9. &lbrack;Selenium&rsqb; 使用Javascript选中Input框里的内容,然后清空

    当我们需要清空Input框里的内容,直接使用el.clear()方法又行不通时,可以使用Javascript先去选中内容,然后再使用el.clear()方法:

随机推荐

  1. 关于mysql数据库插入数据,不能插入中文和出现中文乱码问题

    首先,推荐一篇博客:http://www.cnblogs.com/sunzn/archive/2013/03/14/2960248.html 当时,我安装完mysql数据库后,新建一个数据库后插入数据 ...

  2. DIV布局-高度不同DIV,自动换行并对齐

    最近弄了一个动态添加div框,每个div框内容有多有少,要支持div高度自适应,还要添加的div自动追加,并且换行还要保持每行对齐. 刚开始的效果: 要改啊,搞不定,问了UI高手,终于给出了完美解决方 ...

  3. iOS网络-02-数据解析&lpar;JSON与XML&rpar;

    数据交互格式 服务器返回给用户的数据,通常是以下两种方式: JSON XML JSON 一种轻量级的数据数据格式,体积比XML小,是服务器返回给移动端通常采用的格式 用使用JSON文件中的数据,需要对 ...

  4. C&num;入门篇6-5:字符串操作 测试StringBuilder的运行效率

    //测试StringBuilder的运行效率 public static void Fun2() { #region string string str = "我喜欢编程!"; / ...

  5. Android XML文件解析

    在Android平台上可以使用Simple API for XML(SAX) . Document Object Model(DOM)和Android附带的pull解析器解析XML文件. 下面是本例子 ...

  6. POJ 1987 Distance Statistics

    http://poj.org/problem?id=1987 题意:给一棵树,求树上有多少对节点满足距离<=K 思路:点分治,我们考虑把每个距离都存起来,然后排序,一遍扫描计算一下,注意还要减掉 ...

  7. SecureCRT 选择Courier New等其他字体&period;

    http://justwinit.cn/post/5813/ 如何解决SecureCRT无法选择Courier New等其他字体最终解决办法:到C:\Windows\Fonts目录下,找到Courie ...

  8. STC-单片机控制系统

    电源测量命令 60V开 FD02060001010100000060V关 FD02060002010100000060V保开 60V保关 -8KV开 -8KV关 FD02092802010201000 ...

  9. SpringCloud是否值得引入?

    中小型互联网公司微服务实践-经验和教训 http://xujin.org/sc/sc-zq/#more Spring Cloud在国内中小型公司能用起来吗?https://mp.weixin.qq.c ...

  10. 单片机成长之路(51基础篇) - 022 N76e003 APROM模拟EEPROM驱动

    N76e003单片机内部没有EEPROM,但是可以使用 APROM模拟EEPROM功能,代码如下: eeprom.h #ifndef _EEPROM_H_ #define _EEPROM_H_ //E ...