代码在这里: http://pastebin.me/6d3b7cfcd79b35615b41c2b8b305a159
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Style-Type" Content="text/css" />
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<style type="text/css">
<!--
.problems-contents .wrapper-header{
height:84px;
}
.lessons-wrapper {
/*behavior:url(/MM/css/htc/ie-css3.htc);*/
border:1px solid #CCCCCC;
width:696px;
height:450px;
}
#problems-all { display:none; }
div.active {
-moz-border-radius:5px 5px 0 0;
border-radius:5px 5px 0 0;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
background:none repeat scroll 0 0 white;
border-color:#CCCCCC;
border-style:solid solid none;
border-width:1px 1px 0;
cursor:default;
float:right;
height:26px;
line-height:26px;
text-align:center;
width:120px;
margin-left:10px;
font-size: 11px;
font-weight: normal;
position:relative;
}
div.non-active {
-moz-border-radius:5px 5px 0 0;
border-radius:5px 5px 0 0;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
height:26px;
line-height:26px;
text-align:center;
width:120px;
float:right;
cursor:hand;
cursor:pointer;
border-color:#DDD;
border-style:solid solid none;
border-width:1px 1px 0;
margin-left:10px;
font-size: 11px;
font-weight: normal;
position:relative;
}
.lessons-tab-header {
float:right;
font-size:12px;
font-weight:bold;
margin-top: 57px;
position:absolute;
/*z-index:10;*/
display:inline-block;
width:278px;
left:418px;
}
.rightmargin10 { margin-right:10px; }
.problems-contents{
position:absolute;
top:92px;
left:50px;
height:452px;
width:698px;
background:white;
display:none;
z-index: 20;
width: 698px;
}
.cross{
float:right;
margin: 4px 4px 0 0;
width:12px;
zoom : 1;
line-height:16px;
}
.cross a{
color: red;
font-family:Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
text-decoration: none;
line-height:16px;
}
.wrapper-header {
background-color:#E6E6E6;
height:50px;
padding-left:13px;
font-size:20px;
font-weight:bold;
}
-->
</style>
<script type="text/javascript">
function show(){
$(".problems-contents").show();
$('#problems-incorrect').hide();
$('#problems-all').show();
}
</script>
<a href="javascript:show();">show</a>
<div class="problems-contents">
<div class="lessons-wrapper" id="problems-all">
<div class="wrapper-header">
<div class="cross"><a href="javascript:$('.problems-contents').hide();void(0);">X</a></div>
<div class="lessons-tab-header">
<div class="non-active" onclick="$('#problems-all').hide();$('#problems-incorrect').show();">Missed Problems</div>
<div class="active">All Problems</div>
</div>
</div>
</div>
<div class="lessons-wrapper" id="problems-incorrect">
<div class="wrapper-header">
<div class="cross"><a href="javascript:$('.problems-contents').hide();void(0);">X</a></div>
<div class="lessons-tab-header">
<div class="active">Missed Problems</div>
<div class="non-active" onclick="$('#problems-incorrect').hide();$('#problems-all').show()">All Problems</div>
</div>
</div>
</div>
</div>
</body>
单击“显示”,单击“未接问题”,单击红色“X”(右上角),再次单击“显示”,选项卡混乱。
它只发生在IE7中。如何解决?
答案 0 :(得分:0)
我确实有一个临时解决方案,直到找不到任何好的解决方案。当您通过javascript创建该选项卡时,创建后尝试刷新它。例如
$('#yourtabParent').html($('#yourtabParent').html());
它会解决你的问题,但你可以看到它不是一个完美的解决方案:( 如果你没有任何解决方案,我会在空闲时间看一下。因为这是一个很好的问题