0
<!DOCTYPE html>
<html>
<head>
  <title>Test IE8 pre calc</title>
</head>
<body>

<div id='inserthere'></div>
<p id="dump"></p>
<p id="dump2"></p>
</body>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script>
  $(function () {
    var t = "<table style='white-space: pre;'><tr><td>abc def\nghi</td></tr></table>";

    $("#inserthere").append($(t));
    $("#dump").text($("tr").height());

    window.setTimeout(function () {
      $("#dump2").text($("tr").height());
    }, 0);
  });
</script>
</html>

上記のコードでは、実行時に DOM にテーブルを挿入しています。テーブルは、'pre' 空白規則を使用してフォーマットされます。

height()複数行の td を含む行が挿入と同じ呼び出しで計算される場合、IE8 は 1 行 (21 ピクセル) を誤って報告します。同じ呼び出しが非同期で行われた場合、IE8 は 2 行 (40 ピクセル) を正しく報告します。

IE9/10/Safari/Chrome/Firefox で問題ありません。

4

1 に答える 1

0

私は回避策を見つけていないので、答えはそれをしないことです。空白の 'nowrap' は、キャリッジ リターンが に置き換えられると同様に機能し<br>ます。

于 2013-02-15T17:16:19.077 に答える