HTML表格在IE9中无法正确显示

我使用的是asp:Repeater创建一个HTML表，就像这样：

标记：

<asp:Repeater ID="myRpt" runat="server"> 
    <HeaderTemplate> 
     <table id="myGrd" border="0" style="cursor:pointer;width:100%; background-color:white;" cellpadding="2" cellspacing="0"> 
      <tbody> 
    </HeaderTemplate> 
    <ItemTemplate> 
     <tr onclick="criteria.rowClicked(this);"> 
      <td style="border:solid 1px black;"> 
       <asp:Literal ID="lblName" runat="server"></asp:Literal> 
      </td> 
      <td style="border:solid 1px black;width:200px;"> 
       <asp:Literal ID="lblRange" runat="server"></asp:Literal> 
      </td> 

      <td style="display:none;" > 
       <asp:Literal ID="lblMisc" runat="server"></asp:Literal> 
      </td> 
     </tr> 
    </ItemTemplate> 
    <FooterTemplate> 
     </tbody> </table> 
    </FooterTemplate> 
</asp:Repeater>

VB：

Public Sub populateGrid(ByVal ds As DataSet) 
     'ds is just made from a simple select query 
     myRpt.DataSource = ds 
     myRpt.DataBind() 
    End Sub 

Private Sub myRpt_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.RepeaterItemEventArgs) Handles myRpt.ItemDataBound 
     If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then 
      Dim lblName As Literal = e.Item.FindControl("lblName") 
      Dim lblRange As Literal = e.Item.FindControl("lblRange") 
      Dim lblMisc As Literal = e.Item.FindControl("lblMisc") 

      lblName.Text = "<font style='font-size:10pt; font-family:arial;'>" & Trim(e.Item.DataItem("Name")) & "</font>" 
      lblRange.Text = "<font style='font-size:10pt; font-family:arial;'>" & Trim(e.Item.DataItem("Range")) & "</font>" 
      lblMisc.Text = "<font style='font-size:10pt; font-family:arial;'>" & Trim(e.Item.DataItem("Miscellaneous")) & "</font>" 
     End If 
    End Sub

这将显示在Firefox罚款和Chrome，并且大部分时间都在IE中。然而，有时对于更大的表（50+行），IE的行为很奇怪。这似乎添加一个空白单元格...

enter image description here

...但没有什么在我使用的开发工具检查HTML的。不正确的行具有与正确行相同的标记，单元格文本除外。还有，如果我删除不正确的行，它上面的那个开始显示错误。

请有人可以建议为什么地球上IE是这样渲染，以及我可以做些什么来阻止它。

来源

2012-08-29 Urbycoz

看起来这是一个HTML/CSS/IE问题，与ASP无关。你有可能在JS小提琴中复制这个问题吗？（http://jsfiddle.net/） –

我已经将HTML复制到jsfiddle。奇怪的是，它似乎在那里呈现。 – Urbycoz

只是一个想法 - 是IE浏览器渲染页面在怪癖模式？如果您在页面上打开开发工具，菜单栏右侧报告的浏览器模式和文档模式是什么？ –

这似乎是IE9在渲染大型表格时遇到的一个已知问题。当删除表格def打开和关闭标记之间的空白时，问题得到了解决，例如。 </td><td>

MSDN discussion on IE 9 rendering

来源

2012-08-31 16:56:02

+1我相信这是一个IE9的BUG，我以前看过这个错误，只有IE9展示了这种行为。 – Icarus

+1这样的头痛，但这样一个简单（尽管奇怪）的解决方案。赏金赏赐 - 谢谢！ – Urbycoz

@Urbycoz，可以把问题的解决方案，因为链接“http://goo.gl/uhOSk”被打破 –

这是一个已知IE9的问题，则可以通过下面的代码的某个地方在HTML页面中解决这个问题：

$(function() { 
    var browser = $.browser; 
    if (browser.msie && browser.version.slice(0,3) == "9.0") { 
     $('table').each(function(index) { 
       var replace = $(this).html().replace(/td>\s+<td/g,'td><td'); 
       $(this).html(replace); 
     }); 
    } 
});

来源

2012-09-24 20:06:50 Hamid

-2

我有扩张了巨大的表时，Click事件发生。只发生在IE9中，在IE8，IE10，Chrome等都很好。

以上解决方案对我来说是失败的，以及其他同类型的答案。

我解决这样说：

我添加边框表中，很明显的是，HTML是不正确的。一些colspan丢失或者细胞需要 或者可能是任何东西。

我还注意到，现在，与表border=1属性，点击展开的问题已消失。

所以我把一个类xltable到表中，并把.xltable td {border:0px solid white;}在我的CSS。

我的代码仍然不“有效”，但它的工作原理。

来源

2014-10-23 18:55:13 Petamannen

-1这是一个完全不同的问题。 – Urbycoz

HTML表格在IE9中无法正确显示

回答

相关问题