本文翻译自:how to reset

I am developing a metro app with VS2012 and Javascript 我正在使用VS2012和Javascript开发Metro应用程序

I want to reset the contents of my file input: 我想重置文件输入的内容:

<input type="file" id="uploadCaptureInputFile" class="win-content colors" accept="image/*" />

How should I do that? 我应该怎么做?


#1楼

参考:https://stackoom.com/question/1ODnN/如何重设-input-type-file


#2楼

The jQuery solution that @dhaval-marthak posted in the comments obviously works, but if you look at the actual jQuery call it's pretty easy to see what jQuery is doing, just setting the value attribute to an empty string. @ dhaval-marthak在评论中发布的jQuery解决方案显然有效,但是如果您查看实际的jQuery调用,则很容易看到jQuery在做什么,只需将value属性设置为一个空字符串即可。 So in "pure" JavaScript it would be: 因此,在“纯” JavaScript中,它将是:

document.getElementById("uploadCaptureInputFile").value = "";

#3楼

You can just clone it and replace it with itself, with all events still attached: 您可以克隆它并替换为它,同时保留所有事件:

<input type="file" id="control">

and

var input = $("#control");function something_happens() {input.replaceWith(input.val('').clone(true));
};

Thanks : Css-tricks.com 谢谢:Css-tricks.com


#4楼

You can´t reset that since it is an read-only file. 您无法重置该文件,因为它是只读文件。 you can clone it to workaround the problem. 您可以克隆它来解决此问题。


#5楼

您需要将<input type = “file”>包装到<form>标记中,然后可以通过重置表单来重置输入:

onClick="this.form.reset()"

#6楼

SOLUTION

The following code worked for me with jQuery. 以下代码适用于jQuery。 It works in every browser and allows to preserve events and custom properties. 它适用于所有浏览器,并允许保留事件和自定义属性。

var $el = $('#uploadCaptureInputFile');
$el.wrap('<form>').closest('form').get(0).reset();
$el.unwrap();

DEMO 演示

See this jsFiddle for code and demonstration. 有关代码和演示,请参见此jsFiddle 。

LINKS 链接

See How to reset file input with JavaScript for more information. 有关更多信息,请参见如何使用JavaScript重置文件输入 。

如何重设<input type = “file”>相关推荐

  1. html input type=file 文件上传; 图片上传; 图片闪烁

    (1)input file 对话框和 获取选中文件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  2. <input type=“file“>实现上传文件

    嗨害嗨,我又来了奥.今天讲一个项目中常见的例子,就是利用input type="file"来进行表单上传文件.首先,我们写好html,如下. <form id="f ...

  3. 自定义input type=file 样式的方法

    为什么80%的码农都做不了架构师?>>>    为什么要美化file控件?试想一下,别的孩子都穿戴整齐漂亮,其中两个孩子怎么都不鸟你,太不和谐了. 原始的file控件是这样的: &l ...

  4. java注解接收上传文件,前台:Input type=file 后台获取文件内容用的是spring注解,当地环境上传图片是好的,发布到服务器上图片读取不到,求大神指点...

    当前位置:我的异常网» Java Web开发 » 前台:Input type="file" 后台获取文件内 前台:Input type="file" 后台获取文 ...

  5. 利用css对input[type=file] 样式进行美化,input上传按钮美化

    2019独角兽企业重金招聘Python工程师标准>>> <input type="file" name="fileUpload"/> ...

  6. js 获取input type=file 文件,并且上传

    html页面: <input type="file" class="inputPic" allowexts="gif,jpeg,jpg,png, ...

  7. Android WebView 支持H5图片上传input type=file

    2019独角兽企业重金招聘Python工程师标准>>> Android WebView 缓存处理 Android WebView 支持H5图片上传<input type=&qu ...

  8. 解决input[type=file]打开时慢、卡顿问题

    解决input[type=file]打开时慢.卡顿问题 参考文章: (1)解决input[type=file]打开时慢.卡顿问题 (2)https://www.cnblogs.com/zhouyang ...

  9. Input type=“file“上传文件change事件只触发一次解决方案

    Input type="file"上传文件change事件只触发一次解决方案 参考文章: (1)Input type="file"上传文件change事件只触发 ...

最新文章

  1. 独家 | 增强数据库管理:一份简单的综述
  2. php 61850,南瑞内部61850培训教程很好很强大-系统集成文档类资源
  3. CSS:超出部分省略号
  4. java 字节数组 操作_Java-固定字节数组对象
  5. 微信企业付款开发 C#
  6. 如何在SAP Spartacus里捕捉感兴趣的事件
  7. 什么是串口服务器?串口服务器都用在哪些领域?
  8. Python DataFrame Api整理
  9. 【CCCC】L3-019 代码排版 (30分),大模拟
  10. Python正则表达式初识(七)
  11. 云服务器我的数据保存在哪个文件夹,云服务器存储在哪里
  12. Solidity编程语言
  13. Excel2013 破解(编辑工作表受保护)密码
  14. W5500开发笔记 | 01- W5500 Socket API的说明
  15. IDEA代码放大缩小快捷键设置、注释、标识符以及关键字。
  16. 棠玥寕近照曝光,淡雅着装,盖不住魅力
  17. ubuntu20.04卸载virtualbox失败,“if your system is using efi secure boot you may need to sign the kernel “
  18. PYTHON练习题---设有一头小母牛,从出生第四年起每年生一头小母牛
  19. 唱好歌首先要掌握上海学唱歌的发音技巧
  20. 六、基于Verilog的信号发生器DDS的设计

热门文章

  1. 笔记-返回到前一个页面时显示前一个页面中ajax获取的数据
  2. php将汉字转换为拼音和得到词语首字母(一)
  3. windows下Qt5.4.2 for android开发环境配置
  4. html中table边框属性
  5. Swift中的可选类型(Optional)
  6. 话里话外:按单制造(MTO II)信息化管理特点
  7. php 基础系列之 php快速入门
  8. Java获取接口所有实现类的方式
  9. Oracle Restart能够用来给Oracle GoldenGate 做 High Availability 使用么?
  10. 51nod 1050循环数组最大字段和