ajax 中单元格之间显示的空白区域(或空白区域)获取的数据仅在 IE9 浏览器中馈送到表中

Question

正如标题所暗示的那样，我有一个从数据库加载的表。首先只提取 15 行。稍后有办法使其显示15,50和100条记录以使用下拉列表显示。这是通过 ajax 获取的。如果我使获取记录计数超过 59 或更高，如何在随机行的单元格之间创建空白空间。它只发生在IE9浏览器中。IE浏览器版本<9都不错，FireFox，Chrome，Safari也不错。这是我的第一个问题，所以我不允许发布图像，所以我会在下面放一些数字形式。

|..1..||..2..||...3...||....4....||.5.||..6..||..7..|

假设上面是一行，条形图充当左右边框。我在IE9 ajax获取的数据中得到的内容如下

|..1..||..2..||...3...||....4....||.5.||..6..||..7..|

|..1..|_ _ _|..2..||...3...||....4....||.5.||..6..||..7..|

|..1..||..2..||...3...||....4....||.5.||..6..||..7..|

|..1..||..2..||...3...|_ _ _ _|....4....||.5.||..6..||..7..|

|..1..||..2..||...3...||....4....||.5.||..6..||..7..|

您可以在第 2 行（第 1 列之后）和第 4 行（第 3 列之后）中看到空格（由 _ 'underscore' 表示）。我没有任何想法，因为IE开发人员/调试器工具栏没有多大帮助。效果不是随机的，因为我在刷新时或清除缓存后在单元格之间获得相同的空白空间。可能是由于 ajax 获取的数据与 IE9 渲染它有关吗？有没有人遇到过这样的问题或一个接近的问题。任何帮助将不胜感激。

Answer 1

dhiraj - MS 似乎没有任何关于这个 IE9 错误的官方声明，但我不止一次经历过。 它似乎与源代码中的表行和单元格之间的空格有关，并且只发生在 ajax 回发后在 UpdatePanels 中呈现的表上。 我找到了该问题的（丑陋）修复程序。

如果使用 ListView 控件，则可以删除表结构中的空格。 不幸的是，它使您的源代码更加不可读，但它似乎确实解决了问题。 因此，例如，如果您的原始代码如下所示：

<asp:ListView ID="ListView1" runat="server">
<LayoutTemplate>
    <table>
        <asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
    </table>
</LayoutTemplate>
<ItemTemplate>
    <tr>
        <td><%# Eval("field1") %></td>
        <td><%# Eval("field2") %></td>
        <td><%# Eval("field3") %></td>
        <td><%# Eval("field4") %></td>
    </tr>
</ItemTemplate>

您的"固定"代码需要如下所示：

<asp:ListView ID="ListView1" runat="server">
<LayoutTemplate>
    <table><asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder></table>
</LayoutTemplate>
<ItemTemplate>
    <tr><td><%# Eval("field1") %></td><td><%# Eval("field2") %></td><td><%# Eval("field3") %></td><td><%# Eval("field4") %></td></tr>
</ItemTemplate>

希望这有帮助！

Answer 2

我只想补充一点，我遇到了完全相同的问题。

通过 AJAX 加载表会导致 TD 元素之间出现随机间隙。

呈现此表的代码为：

echo("  <tr>")
echo("      <td>Column1</td>")
echo("      <td>Column2</td>")
echo("      <td>Column3</td>")
echo("      <td>Column4</td>")
echo("      <td>Column5</td>")
echo("  </tr>")

echo（） 是 response.write 的简单包装器。

正如此处的评论中所建议的，我只是删除了响应上的空格，如下所示：

echo("<tr>")
echo("<td>Column1</td>")
echo("<td>Column2</td>")
echo("<td>Column3</td>")
echo("<td>Column4</td>")
echo("<td>Column5</td>")
echo("</tr>")

这立即解决了问题，丑陋的标记，但表格现在呈现一致。Deffo IE9中的错误

Answer 3

尝试将标签的内容<td>放在标签<div>

Answer 4

我遇到了同样的问题。回发后更新面板中 IE9 中的单元格之间的随机分隔符。

像其他人建议的那样，删除表格单元格元素之间的空格。它有点丑，但它似乎确实有效！

从这里...

<tr class="rpt-row-alt">
   <td>
      <%--Cell Contents --%>
   </td>
   <td>
      <%--Cell Contents --%>
   </td>
   <td>
      <%--Cell Contents --%>
   </td>
   <td>
      <%--Cell Contents --%>
   </td>
   <td>
      <%--Cell Contents --%>
   </td>
   <td>
      <%--Cell Contents --%>
   </td>
</tr>

对此...

<tr class="rpt-row-alt">
   <td>
      <%--Cell Contents --%>
   </td><td>
      <%--Cell Contents --%>
   </td><td>
      <%--Cell Contents --%>
   </td><td>
      <%--Cell Contents --%>
   </td><td>
      <%--Cell Contents --%>
   </td><td>
      <%--Cell Contents --%>
   </td>
</tr>

为我解决了问题！它似乎只是表数据元素之间的间距，因此您不必将整个表行放在一行标记上。