测试环境:
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>

或者

var file = $("#file")
file.after(file.clone().val(""));
file.remove();

参考: http://blog.163.com/thinker_creator/blog/static/101933149200961585128272/
    http://www.jb51.net/article/35491.htm

清空file input框的更多相关文章

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

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

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

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

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

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

  4. [Selenium] 使用Javascript选中Input框里的内容,然后清空

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

  5. 给“file”类型的input框赋值的问题

    开发"新闻编辑"功能时,会遇到给"file"类型的input框赋值的问题,用来展示之前上传的文件,但由于file类型的input框受到安全限制,所以不能被赋值, ...

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

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

  7. js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)

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

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

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

  9. 让单选input框,不在被选中,添加disabled即可。输入框input的一些技巧

    1.让单选input框,不在被选中,添加disabled即可 2.input的file文件对象的清空,只需要input.val("");就可以了.

随机推荐

  1. Activiti系列:为什么Activiti 5.18 的REST的api总是返回404错误

    REST api可以访问了,如下 1.修改db.properties配置文件,让他访问sql server 2.在浏览器中输入如下地址,注意中间有一个service,这点和之前的不一样,在<Ac ...

  2. 动态下载苹果系统提供的多种中文字体(适合对字体有较多需求的应用比如阅读类的app)

    链接:https://developer.apple.com/library/ios/samplecode/DownloadFont/Listings/DownloadFont_ViewControl ...

  3. Opencv step by step - ROI

    什么是ROI?ROI就是region of interest ,就是你感兴趣的图像部分,在图像处理中,可能同时要处理多个ROI. Opencv有ROI的API,但是只能同时处理一个(书本上说的,未验证 ...

  4. 封印术:shadow dom

    置顶文章:<纯CSS打造银色MacBook Air(完整版)> 上一篇:<鼠标滚动插件smoovejs和wowjs> 作者主页:myvin 博主QQ:851399101(点击Q ...

  5. 我给出的一份Java服务器端面试题-适合电话面试

    这部分内容,参考了<面试官的七种武器>一文. 电面与face2face的面试还是有区别的,很多考察方式无法使用. 从简历聊起,逐渐进入正题. Java语法 重载与重写的区别? java如何 ...

  6. 一种仿照Asp.net Mvc思维构建WebSocket服务器的方法

    问题场景 Asp.net Mvc提供了DependencyResolver.Routing.Filter. Modelbinder等webForm所没有新概念,提高Web服务编写的便利性,记得很久之前 ...

  7. Java并发编程-CAS

    CAS(Compare and swap)比较和替换是设计并发算法时用到的一种技术.简单来说,比较和替换是使用一个期望值和一个变量的当前值进行比较,如果当前变量的值与我们期望的值相等,就使用一个新值替 ...

  8. 文件夹文件遍历并插入数据库的操作,IO Directory File的递归操作

    在我们管理内容管理系统时,数据量大时,对机器的依赖性就比较强了,比如,我要将一个文件夹中的很多图片上传到网站,一个个上传会很花时间,就想到了通过遍历文件夹得到文件名,并将路径与文件保存到数据库中对应的 ...

  9. ajax请求模拟登录

    前台 @if (Session["username"] != null) { <div class="login"> <span style= ...

  10. javaWeb开发模式

    1.发展历程 2.模式分析 JSP+JavaBean模式适合开发业务逻辑不太复杂的web服务程序.这种模式下,JavaBean用于封装业务数据,JSP即负责处理用户请求,又显示数据(JSP编写业务逻辑 ...