Question

此问题仅发生在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次。最终第一个文本框被禁用。

有人可以建议解决方法吗？

感谢您的帮助

Answer 1

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

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

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

弹出后禁用所有文本框

1 个答案: