input标签file的value属性IE兼容性问题
在IE中input标签file的value属性是只读的,不能通过js来改变,如下代码在IE中就是无效的:
var input = document.getElementById('file');
input.value = '';
所以当在file中上传了同一张图片时,是不会触发file的change事件的。
但在其他浏览器里就可以轻易的使用js改变value值,使上传同一图片时触发change事件。
为了解决这个问题就要在每次图片上传完成后删除掉这个input再重新生成一个input插入到DOM中,大概的代码如下:
resetFile = function(ele, form, name, str){
var parent = ele.parentNode;
var input = $C('input');
input.type = 'file';
input.className = 'file';
input.name = str;
input.id = str;
parent.removeChild(ele);
parent.appendChild(input);
nodes[name] = input;
Core.Events.addEvent(nodes[name],function(){
var imgvalue = ele.value;
if(imgvalue != ''){
form.submit();
}
},'change');
};
(此代码引用于blog7icp的blog7icp/jobs/bankcardbind.js)
注意:在生成新的input之后要重新绑定change事件,之前绑定的change事件已经跟随着被删除的input删除了。
input标签file的value属性IE兼容性问题的更多相关文章
- input标签file文件上传图片本地预览
<input type="file" name="img-up" id="img-up" value="" /&g ...
- input标签添加上disable属性在移动端(ios)字体颜色及边框颜色不兼容的解决办法。
手机一些兼容性问题: 1.苹果手机输入框input:disabled显示模糊问题 input:disabled, input[disabled]{ color: #5c5c5c; -webkit-te ...
- HTML5中input标签有用的新属性
HTML5对input增加了一些新标签,个人觉得比较常用有效的以下几个 placeholder=“请输入” 常见用于默认提示 autofocus 自动聚焦到当前输入框 maxlength=" ...
- type为number的<input>标签 type和size属性失效
html5中input的type属性增的可取值新增几种,对于不支持这几种新增值的浏览器会统一解析为text类型. Firefox.ie9不支持
- input标签元素,value属性取值问题,赋值
验证val:<input type="text" id="id" name="name" value="空值"&g ...
- input标签添加上disable属性在ios端字体颜色不兼容的问题
input[disabled],input:disabled,input.disabled{ color: #3e3e3e; -webkit-text-fill-color: #3e3e3e; -we ...
- input标签添加上disable属性在移动端字体颜色不兼容的解决办法。
input[disabled],input:disabled,input.disabled{ color: #999; -webkit-text-fill-color:#999; -webkit-op ...
- html5中form表单新增属性以及改良的input标签元素的种类
在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!D ...
- input标签的accept属性、JQuery绑定keyDown事件
一. input标签的accept属性 当我们上传文件或者注册上传头像时,我们可以一般都是使用: <input type="file" id="my_file&qu ...
随机推荐
- jQuery 使用索引值容易出错的一个地方
先看代码 $('input:eq(2)').attr('value', function(index, val){ console.log(index); //输出0 }); 问:当前元素的索引值,不 ...
- scala的面向对象编程
1.scala的简单编程 2.构造方法 辅助构造函数是在主构造函数没有的情况下,执行的构造函数. 3.object的介绍 4.半生类和半生对象 5.半生的案例程序(半生类可以调用半生) 6.apply ...
- zabbix agent安装与配置篇
Zabbix监控windows部署安装 Zabbix agent 在windows上安装部署 (1)手工安装zabbix agent客户端 1. 下载与解压 地址: http://www.zabb ...
- LeetCode Paint House
原题链接在这里:https://leetcode.com/problems/paint-house/ 题目: There are a row of n houses, each house can b ...
- C++学习笔记 知识集锦(二)
1. 命名规范 2. 代码格式 3. QString的判断 4. 对象的判空 5. 隐式接口&显式接口 6. vector&string 7. static 8. const 9. v ...
- jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...
- Linux 搭建NTP服务器
NTP服务器[Network Time Protocol(NTP]是用来使计算机时间同步化的一种协议,NTP服务器可以对其它服务器做时间同步化,从而达到时间统一. 配置环境及要求: A. 假设10.8 ...
- Error : should use android:showAsAction when not using support library
我有一个ListActivity,然后一个menu/options.xml android:showAsAction报错: should use android:showAsAction when n ...
- ios监听键盘弹出 频幕位置改变
- c/c++ qsort 函数的简单使用(1)
#include <stdio.h> #include <stdlib.h> //打印数组元素 void print(int arr[], int n){ ; i < n ...