上次写过如何上传文件，上传成功之后，会出现一些问题。

当我打开上传的文件，但是没有点击上传，然后关闭弹窗，接着继续上传刚才的那个文件。为了满足产品组的要求，我们一般都会把样式进行一定的覆盖。

但这就会出现一定的问题。按照上面说的那种情况，当我再次打开之后覆盖样式的内容为空。

其实刚开始是百思不得其解的，最后想了一下，应该是file文件内容没有清空的原因造成的。

上网查各种清空的方法。

普遍使用较多的就是外部加一个form表单，然后清空form表单里面的内容。

如上图一样，我给input标签外面增加一个form标签，id为videoForm

我们产品需求上传文件是在一个弹框里面的。

所以我每次打开弹框的时候，只需要清空一下该内容就行。

具体代码

document.getElementById('videoForm')&&document.getElementById('videoForm').reset();

第二种方法就是

每次提交成功之后的操作。

document.getElementById('').outerHtml = document.getElementById('').outerHtml

input type file上传文件之后清空内容。的更多相关文章

  1. input type=file 上传文件样式美化（转载）

    input type=file 上传文件样式美化 来源:https://www.jianshu.com/p/6390595e5a36 在做input文本上传时,由于html原生的上传按钮比较丑,需要对 ...

  2. HTML <input type="file">上传文件——结合asp.net的一个文件上传示例

    HTML的代码:(关键是要在form里设置enctype="multipart/form-data",这样才能在提交表单时,将文件以二进制流的形式传输到服务器) 一. <fo ...

  3. jquery判断 input type="file"上传文件是否为空

    要想获取type="file"的input内容,用var file = $("id").val();肯定是不行的,下面是代码: html上传按钮为: <i ...

  4. <input type="file">上传文件并添加路径到数据库

    注:这里是用的mvc所以没法用控件 html代码 <form method="post" enctype="multipart/form-data"> ...

  5. input type='file' 上传文件 判断图片的大小是否合格与witdh 和 height 是否合格

    function CheckFiles(obj) { var array = new Array('gif', 'jpeg', 'png', 'jpg'); //可以上传的文件类型 if (obj.v ...

  6. onclick事件触发 input type=“file” 上传文件

    添加按钮: <input type="button" name="button" value="浏览" onclick="j ...

  7. input[type=file]上传文件（格式判断、文件大小、上传成功后操作）

    var isUploadImg = false; //在input file内容改变的时候触发事件******************上传图片 $('#filed').change(function( ...

  8. 使用 input[type=file]上传文件

    var $file = $('#file'); $('#btn').click(function() { var data = new FormData(); data.append('file', ...

  9. input标签type="file"上传文件的css样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. NSCopying

    ///< .h @interface ChatManager : NSObject <NSCopying> @property (nonatomic) NSUInteger inde ...

  2. Dungeon Master POJ - 2251 (搜索）

    Dungeon Master Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 48605   Accepted: 18339 ...

  3. 当GetWindowText获取不到标题时可以用SendMessage

    GetWindowText所有父窗口标题基本可以获取到, 但是当获取父窗口下的子窗口控件标题文本时有时候就没那么好用了, 这个时候可以通过SendMessage发送消息来获取,也很简单,C/C++代码 ...

  4. SpingBoot之配置文件的值注入问题

    我们在这里研究的是以yml配置文件值注入的问题: Person: lastName: 张三 age: 23 boss: false birth: 2018-10-11 maps: {k1: v1,k2 ...

  5. JS - OOP-继承的最佳实现方式

    如上图,使用第三种方式实现继承最好,也就是加了下划线的. 但是Object.create方法是ES6才支持的,所以,右边就写了一个实现其同样功能的函数.

  6. 删除Zend Studio项目

    导入了过大的项目,导致很卡,且Close Project和Delete操作不了,一直无响应. 调整项目目录下的隐藏文件夹,删除对应项目: E:\www\.metadata\.plugins\org.e ...

  7. 动态规划：HDU1864-最大报销额（处理带小数的dp问题）

    最大报销额 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Descriptio ...

  8. 3、python中的字符串

    一.前言 字符串是python中重要的数据类型.字符串就是一段文本,在python中用引号来标示. 二.字符串分类 字符串根据使用场景不同,一共分成3类: (1)单引号.双引号创建的单行字符串: 在单 ...

  9. 69、Android 布局中轻松实现图片的全屏、居中、平铺

    public void paint() { if (item.laying_mode != 1)//平铺或者充满 { new AsyncTask<Void, Void, Void>() { ...

  10. Windows API 学习记录1

    这里面的好多函数不能死记硬背,知道有这个函数就行,等用到了,再回来细看 一.窗口管理函数包括以下几类: 按钮函数(Button) Microsoft提供了对话框和控制来支持应用程序与用户之间的交互通讯 ...