2

IE10 のテーブルビューに問題があります。何らかの理由で、IE10 は画面に描画される前にセルの幅を測定しようとしますが、他のブラウザーは測定しません。IE10 と別のバージョン/ブラウザーにブレークポイントを配置すると、違いがはっきりとわかります。

コードはかなり複雑ですが、問題を再現するスニペットを作成できました。

var cells = 40;
var rows = 1000;

console.clear();

function measure(obj) {
    obj = $(obj);
    console.log(obj.getWidth());
}

var randomNumber = function (scale, offset) {
    scale = scale || 10;
    offset = offset || 50;
    return (Math.floor(Math.random() * 11) * scale) + offset;
};

var output = "<table><thead><tr>";

for (var i = 0; i < cells; i++) {
    output += "<th width='" + randomNumber() + "'></th>";
}
output += "</tr></thead><tbody>";
for (var j = 0; j < rows; j++) {
    output += "<tr>";
    for (var i = 0; i < cells; i++) {
        output += "<td></td>";
    }
    output += "</tr>";
}

output += "</tbody></table>";

// Insert into DOM.
$(document).body.insert(output);

// Measure the elements.    
$$('th').each(measure);

フィドル

列と行の量に応じて、IE10 は正しい幅を返すか、より複雑な場合はすべてに対して 0 を返します (数値を調整してこれをテストできます)。

0 を返している間、ループで getWidth 関数を遅らせようとしましたが、ブラウザをロックして最終的に 0 を返すだけです。IE10に正しい幅を返す方法はありますか?

4

1 に答える 1

0

これは明らかに IE10 の欠陥のようです。これを行うことで、測定値を表示することができました：

setTimeout(function () {
    $$('th').each(measure);
}, 1000);

IE10 が何らかの要素の遅延レンダリングを行っており、新しい要素が配置される前に測定関数が実行されているように見えます。

明らかに理想的な解決策ではありませんが、いくつかのアイデアが得られるかもしれません。

于 2013-10-14T01:04:37.787 に答える