弹出后禁用所有文本框答案

【问题标题】：All textboxes disabled after popup弹出后禁用所有文本框
【发布时间】：2012-11-20 23:06:38
【问题描述】：

这个问题只出现在 IE8 上（不是 IE8 兼容模式）。我有一个名为 sample.htm 的文件：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'></script>
</head>
<body style='position:relative;z-index:1'>
<input><a href="javascript:Popup('test1.html');">Click</a>
<script>
function Popup(url) {
    overlay = $("<div style='position:fixed; width:100%; height:100%; z-index:10005'><div style='position:absolute; width:100%; height:100%; background:black; -ms-filter:\"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\"; filter: alpha(opacity=50);'></div>");
    iframe = $("<iframe name='Overlay' style='position:absolute; height:80%; width:80%; top:10%; left:10%;' src='" + url + "'></iframe>");
    closebut = $("<img style='position:absolute; cursor:pointer; right:10%; top:10%;' width='24px' height='24px' src='/images/close.png' onclick='RemovePopup()' >");
    overlay.append(iframe).append(closebut);
    $('body').prepend(overlay);
}
function RemovePopup() {
    overlay.animate({top:'100%'},800,'swing', function() { $(this).remove(); });
}
</script>
</div></body></html>

这里是test1.html的完整内容：<html><head></head><body><input></body></html>

所以创建这两个文件，在 IE8 中打开 sample.htm，单击链接打开弹出窗口，在文本框中输入内容，关闭弹出窗口，尝试在第一个文本框中输入。如果可以，请重复 2 或 3 次。最终第一个文本框被禁用。

任何人都可以提出解决方法吗？

感谢您的帮助

【问题讨论】：

如果人们不想创建这两个文件，请告诉我，我会尝试将它们放到网上的某个地方。
重新创建它没问题。可能与不透明度过滤器有关，但我仍在研究它。
似乎在iframe 关闭时单击它（单击关闭按钮后）会导致这种情况发生。
任何时候点击它都会导致它（甚至在关闭之前）
奇怪的错误，无缘无故随机发生。

标签： javascript jquery html internet-explorer internet-explorer-8

【解决方案1】：

基本上我认为这是一个focus 问题。如果您可以让浏览器进入<input> 似乎禁用的情况，那么您实际上可以Tab 到<input> 并按预期输入一个值。

我相信当 iframe 中的元素具有焦点时，在动画结束时删除 iframe 的 $(this).remove(); 调用会导致问题。我建议在删除 iframe 之前给予第一个 <input> 焦点。

例如，如果是第一个输入，则使用$('input:first').focus();。它似乎在我的测试中有效。

【讨论】：

非常感谢。我使用 jQuery('input:text:visible:first').focus() 覆盖所有情况。
这是一个非常烦人的错误，因为它似乎只影响某些版本或某些机器上的 IE8。