前段时间做了个网盘类的项目，意外发现了这个情况

IE下，将input的父级标签增加 disabled 属性之后，input 的行为变得怪异：

1、input 背景变灰，疑似也被disabled 了。

2、input 仍然可以输入英文数字等字符，但无法切换输入法，无法粘贴

其他浏览器不受影响。

层层排查之后才发现是 input 的父级标签被设置了 disabled="true" 所致。

可以用IE 打开这个DEMO 查看。

<!doctype html>

<html>

<head>

<meta charset="gb2312">

<title>disable input parent</title>

<script src="http://s0.qhimg.com/lib/jquery/183.js"></script>

<style>

	.enabtn,

	.dis .disbtn{ display:none;}

	.dis .enabtn{ display:block;}

	input{width:300px; margin-bottom:4px; height:24px;}

	button{ width:86px; height:26px; line-height:26px;}

</style>

</head>

<body>

<span id="con">

<input type="text" maxlength="255">

</span><br>

<button type="button" class="disbtn">

	disable span

</button>

<button type="button" class="enabtn">

	enable span

</button>

<script>

	$('button').click(function(){

		var btn = $(this);

		if(btn.hasClass('disbtn')){

			$('body').addClass('dis');

			$('#con').attr('disabled',true);

			}else{

			$('body').removeClass('dis');

			$('#con').removeAttr('disabled');

			}

		});

</script>

</body>

</html>

　　

IE下 input 的父级标签被 disabled 之后引发的怪异行为的更多相关文章

  1. JS - 点击事件排除父级标签

    点击事件排除父级标签,这里使用的是stopPropagation()方法.event.stopPropagation(); 对了,这里还用了解除click事件,unbind. 下面这篇博文,介绍挺全的 ...

  2. IE6下绝对定位元素父级宽高是奇数,绝对定位元素的right和bottom值会有1个像素的偏差

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

  3. IIS7.5下启用asp父级路径

    如果你是运行asp显示需要启动父路径的话可以这样解决: 在IIS 下 打开ASP选项,有个启用父路径的选择项,选择True 就可以了! 具体看图!因为没法贴两张图,就弄在一张里了!

  4. 解决“”父级标签和子标签边框重叠，设置子标签的margin父标签会跟着移动“”的方法

    1.可以给父标签一个padding,然后给一个很小的值,虽然不影响整体但是不建议使用 2.给父标签一个"over:hidden"的样式,推荐使用

  5. CSS解决父级边框坍塌的问题

    1. 浮动元素后面增加空的div 首先在父级标签内添加如下<div>标签 <div id="clear"></div> 然后在CSS中对该标签进 ...

  6. Element-ui树形控件el-tree获取父级节点的id

    Element-ui官网给的方法 getCheckedKeys() { console.log(this.$refs.tree.getCheckedKeys()); }, 这种只有在所有子级都被选中的 ...

  7. div高度不能自适应（子级使用float浮动，父级div高度不能自适应）

    1.问题截图: 2.问题描述: 由于地址.公司名长度的不定性,所以每一条地址所在的父级div高度不定,但是需要设置一个最小的高度min-height:48px;但是当内容增加的时候,父级div高度却不 ...

  8. 前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)

    前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型) 一丶HTML块级标签 排版标签 p 标签: 段落标签,会自动在段落上下加上空白来分开 p标签 ...

  9. Dedecms中{dede:type}标签支持调用父级栏目名称

    需求: 我们用{dede:type}标签调用栏目相关内容时,同时需要调用该栏目的父级栏目的名称. {dede:type}标签的代码做了一下开发,支持这个调用了. 开发方法: 1.打开include/t ...

随机推荐

  1. 引用mvvmlight dll ，操作command

    前言 因为vs2010没有集成mvvmlight 所以想要使用mvvmlight的relaycomman需要引用dll 需要测试某个功能的时候,不能进行快带的集成 引用mvvmlight dll 如果 ...

  2. tortoise svn 请求的名称有效，但是找不到请求的类型的数据

    可能是博客园出bug了,现在无法放图,间断重复刷新十多次依然如故,弃之 这个问题是在安装完svn服务器(visual svn)后复制url,tortoise svn import 粘贴url后 出现的 ...

  3. [leetcode]215. Kth Largest Element in an Array 数组中第k大的元素

    Find the kth largest element in an unsorted array. Note that it is the kth largest element in the so ...

  4. OpenSSL基础知识

    1.openssl里的fips是什么意思? openssl-fips是符合FIPS标准的Openssl. 联邦信息处理标准(Federal Information Processing Standar ...

  5. BZOJ1699: [Usaco2007 Jan]Balanced Lineup排队 - 线段树

    description 查询区间最大和最小 题解 线段树 愉悦身心啊 代码 #include<cstring> #include<cstdio> #include<alg ...

  6. Ps中的难点问题分析

    一.布尔运算的运用 1.布尔运算是在图形工具组中使用,快捷键“U” 2.使用方法:都是在同一图层下运算,在进行布尔运算之前,首先用路径选择工具,小黑箭头,快捷键是“A” 选取你要运算的图形. 3.布尔 ...

  7. apache的80端口被占用

    1.netstart -ano | findstr "80":查看80端口是否被占用,并找出对应的pid 2.关掉pid对应的进程

  8. [SoapUI] Tips and Tricks(提示和技巧)

    https://www.soapui.org/scripting-properties/tips-tricks.html

  9. c++11 改进设计模式 Singleton模式

    关于学习 <深入应用c++11>的代码笔记: c++11之前是这么实现的 template<typename T> class Singleton{ public: stati ...

  10. Directory /usr/local/hadoop/tmp/tmp/hadoop-root/dfs/name is in an inconsistent state: storage directory does not exist or is not accessible

    解决方法: <property> <name>hadoop.tmp.dir</name> <value>/usr/local/hadoop/tmp< ...