我构建了一些简单的标签,点击后会显示隐藏的div。非常简单。一切都很好,除了在IE中。出于某种原因,即使我使用jQuery .show()函数,它也不会将隐藏的div设置为display:block,但只是将其隐藏起来,这非常令人沮丧。

示例页面: http://www.puc.edu/alumni/give-puc

jQuery for tabs:

$('#teamTabs li').click(function() {
 $('#teamTabs li').removeClass('selected');
 $(this).addClass('selected');
 $('.teamTab').hide();
 var id = $(this).attr('id');
 if (id == 'teamTab1') {
  $('#team1').show();
 } else if (id == 'teamTab2') {
  $('#team2').show();
 } else if (id == 'teamTab3') {
  $('#team3').show();
 } else if (id == 'teamTab4') {
  $('#team4').show();
 }//end else if

 return false;

});//end click

为什么IE不会将div设置为显示的任何想法:阻止?

有帮助吗?

解决方案

我意识到你已经在其他地方找到了问题,但是对于其他人稍后发现这个问题(并且从无答案列表中得到这个),你可以减少/简化你的代码:

$('#teamTabs li').click(function() {
  $(this).addClass('selected').siblings().removeClass('selected');
  $('.teamTab').hide();
  $('#team'+ this.id.replace('teamTab','')).show();
  return false;
});

其他提示

我有类似的问题。我发现IE实际上是将显示更改为阻止,但它也使每个display:none;=>块都有visibility:hidden;

通过执行以下操作,我能够正确显示我的元素:

$('#team1').show(); // shows for all browsers but IE
if($.browser.msie){
   $('#team1').css({"visibility":"visible"});
}

我在将问题缩小到两个可能隐藏我的HTML的可能CSS元素之后使用两个警报找到了这个:display:none;和可见性:隐藏。

保证在$('#team1').show();

之后立即执行此提醒

alert( $('#team1').css("display"));您的显示将被阻止 alert($('#team1')。css(<!> quot; visibility <!> quot;));你的能见度将被隐藏。

似乎IE在设置为<!>“;无<!>”的显示时会自动隐藏块;在css中然后通过Jquery进行更改。对于定义为display:block的元素,这似乎不是问题。只要您首先在CSS中定义它们,这些元素应始终正常。

希望这可以帮助其他人解决这个问题:)

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top