添加到其DOM ie8之后，HTML表不会重绘

Question

IE bugs out on me with a large table by not redrawing the table when I add input's to it using jquery. It forces a redraw/update when I scroll the table up or down but otherwise it doesnt render the input properly.

<div style="overflow: auto;">
   <table>
       <tbody>
           /// lots of rows
       </tbody>
   </table>
</div>

and the javascript snippet :

input = $(document.createElement("input"));
input.attr("type", "text");
input.attr("value", $.trim(div.html())); 
TD.prepend(input);

This works just fine in firefox but refuses to behave in IE8. A way to fix is to force a redraw but I can't seem to find a way to do that.

I think ie8 is rendering in quirks mode but it doesnt work in either ie8 or quirks mode.

[Edit]

function forceIERedraw() {
    if ($.browser.msie) {
        obj = getThing();
        obj.scrollTop = obj.scrollTop - 1;
        obj.scrollTop = obj.scrollTop + 1;
    }
}

This works but of course makes the screen shake ever so slightly. Horribly hacked but at least you can see things that I add to the dom.

Answer 1

hiding and showing the body usually works with issues like yours:

input = $(document.createElement("input"));
input.attr("type", "text");
input.attr("value", $.trim(div.html())); 
TD.prepend(input);
document.body.style.display = 'none';
document.body.style.display = 'block';

Answer 2

Today I encountered somewhat similar problem, solved it by just rewriting the whole html of the div again. Later I found your question here...

Lets say your div had an id stupiddiv
Now you do something like this :
$('#stupiddiv').html($('#stupiddiv').html());
after appending the table and all... That would just work if you had small tables, but with huge tables, I guess it would take performance toll...

Answer 3

Turns out the problem was specific to the website im working on (10 years old at that.) and rendering in ie quirks mode. Basically the whole thing was a mess and this was a side effect of various other problems on the page.