重置 file input
有时用户上传相同附件时也需要触发input[type='file']的change事件,除了将form重置外,还可以将input的value设为空
<input type="file" id="test" name="test" multiple>
javascript:
var fileinput = document.getElementById('test');
fileinput.onchange = function() {
if (this.value) {
console.log(this.value);
//重置,IE11会触发change事件
this.value = '';
//IE9,IE10需要重置type
this.type = 'text'
this.type = 'file'
} else {
//value设为''触发的change(IE11)
console.log("已重置")
}
}
已测试的浏览器:Chrome, Firefox, IE11,通过IE11的Emulation测试的IE9和IE10,不支持IE7和IE8(IE7,IE8在设置input.type时会报错:Could not get the type property. This command is not supported.)
重置 file input的更多相关文章
- 基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用
Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使用的时候,也是一步一个脚印一样摸着石头过河,这个控件在界面呈现上,叫我之前使用过的Uploadi ...
- Bootstrap文件上传插件File Input的使用
基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用 Bootstrap文件上传插件File Input是一个不错的文件上传控件, ...
- bootstrap file input 官方文档翻译
file Input官方文档 中文翻译 file input 特性 1.这个插件会把简单的html文件变成一个更好用的文件选择输入控件,通过一个html的文件输入框,能兼容那些不支持jquery或js ...
- Bootstrap File Input的简单使用
安装引入 使用前需要引入其css和js文件, 注意引入路径的问题 <link rel="stylesheet" href="/__PUB__/fileinput/c ...
- File Input Features
文件输入功能 1.该插件将将一个简单的 HTML 文件输入转换为高级文件选取器控件.将有助于对不支持 JQuery 或 Javascript 的浏览器的正常 HTML 文件输入进行回退. 2.文件输入 ...
- 敲代码非常难之logstash之file input插件实现分析
版权声明:本文为横云断岭原创文章,未经博主同意不得转载.微信公众号:横云断岭的专栏 https://blog.csdn.net/hengyunabc/article/details/25665877 ...
- clear & file input & reset & file input
clear & file input & reset & file input Clear <input type="file"> docume ...
- bootstrap File Input 多文件上传插件使用记录(二)删除原文件
在上一篇文章中,主要介绍了file input插件的初始化和多文件同步上传到服务器的相关配置等.这篇主要介绍file input插件的编辑等. 使用场景: 在后台管理框架中,一条数据中包含不固定的多张 ...
- (转)基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用
http://www.cnblogs.com/wuhuacong/p/4774396.html Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使 ...
随机推荐
- push和commit的区别
push和commit的区别 git作为支持分布式版本管理的工具,它管理的库(repository)分为本地库.远程库.git commit操作的是本地库,git push操作的是远程库. git c ...
- netty对http协议解析原理解析(转载)
本文主要介绍netty对http协议解析原理,着重讲解keep-alive,gzip,truncked等机制,详细描述了netty如何实现对http解析的高性能. 1 http协议 1.1 描述 标示 ...
- [WIP]php入門
创建: 2019/06/19 安装 MAMP 变量与运算符 php标签 <?php ... ?> <?php ... ?> ● 在文件最后的 ?> 通常省略, ...
- 第三方登录---微信(使用laravel插件)
转发: https://www.jianshu.com/p/7be757655814 TP框架: http://www.php.cn/php-weizijiaocheng-363509.html
- spring boot 使用 POI 读取Excel文件
内容简介 本文主要介绍使用POI进行Excel文件的相关操作,涉及读取文件,获取sheet表格,对单元格内容进行读写操作,以及合并单元格的操作. Excel文件目录 Excel模板文件存了resour ...
- 测试之美 Part 1
1. 本人曾经在一次电话面试中被问到,为什么你作为一个测试人员,还要别人来告诉你要在哪些平台上去测试,你完全可以自己去定夺.下面的这段话是来自<测试之美>,我觉得很有逻辑的反驳了那位面试官 ...
- iOS开发之swift与OC混编出现的坑,oc中不能对swift的代理进行调用,不能访问swift中的代理,swift中的回调方法
1. Swift与oc混编译具体怎么实现,这儿我就不重复讲出了,网上有大把的人讲解. 2. 在swift与OC混编的编译环境下, oc类不能访问swift创建类中的代理? 解决方法如下: 在代理的头部 ...
- 再看thinkphp5分页类使用
之前使用tp5的分页paginate类时只用到了第一个参数,也就是每页显示多少行 今天又仔细看了下手册和paginate类,发现paginate可传入的参数有很多,可以满足更多需求 比如可以指定分页的 ...
- ECharts 上手
一.获取 ECharts 你可以通过以下几种方式获取 ECharts. 从官网下载界面选择你需要的版本下载,根据开发者功能和体积上的需求,我们提供了不同打包的下载,如果你在体积上没有要求,可以直接下载 ...
- React的核心概念
1.JSX的语法(javascript和XML结合的语法) 2.元素渲染(页面渲染) 3.组件 创建组件和组件之间传参 4.props属性 是父元素(父组件传递给子组件的值)和state状态(子组件自 ...