zoukankan      html  css  js  c++  java
  • IE下 input 的父级标签被 disabled 之后引发的怪异行为

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

    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{300px; margin-bottom:4px; height:24px;}
    	button{ 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>
    

      

  • 相关阅读:
    Apache部署Django项目
    Docker
    常用算法
    Go之基本数据类型
    Go之流程控制
    Go基本使用
    Go安装与Goland破解永久版
    Linux
    详解java中的byte类型
    Linux统计文本中某个字符串出现的次数
  • 原文地址:https://www.cnblogs.com/trance/p/3269846.html
Copyright © 2011-2022 走看看