Ошибка IE10 с расчетной шириной

Question

У меня возникли проблемы с табличным просмотром в 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); 

Fiddle

Теперь в зависимости от количества столбцов и строк IE10 будет возвращать правильные ширины или когда он будет более сложным, он вернет 0 для всех (вы можете настроить номера, чтобы проверить это).

Я пробовал задерживать функцию getWidth с помощью цикла при возврате 0, но все, что делает это, блокирует браузер и возвращает 0 в конечном итоге. Любые идеи, как я могу заставить IE10 вернуть правильную ширину?

Answer 1

Это явно похоже на дефект в IE10. Я был в состоянии получить ваши измерения, чтобы показать, делая это:

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

Это выглядит так, как будто IE10 делает какое-то замедленная рендеринг элементов и функцию измерения выполняется до того, как новые элементы выкладываются.

Очевидно, что это не идеальное решение, но оно может дать вам некоторые идеи.