I have a JavaScript class that displays a partially-opaque div over top of the content of another div when an Ajax request is sent to the server.
When the request returns, the JavaScript class hides the partially-opaque div....it works great...sort of.
Right now, in IE9, when the Ajax request is complete, the partial-opacity is only hidden if the user moves their mouse.
So, my question is, how do I force the brow开发者_运维问答ser to do what it's supposed to do?
This is my extremely simple function that is called after the request returns to the browser:
_hideBlockingDiv: function() {
if (this.get_blockingDivClientID()) {
var blockingElement = $get(this.get_blockingDivClientID());
if (blockingElement != null) {
blockingElement.style.display = 'none';
//I know that this method is executing correctly because I "hi" showed
//up properly...but the element remained visible:
blockingElement.innerHTML = 'hi';
}
//if I add the alert then everything works fine in IE9
//if I don't then the page will remain the same until the user moves their mose
//alert("done");
}
}
Please note that I am not using JQuery. I am using the AJAX.NET library since I am a .NET developer (and JQuery didn't become popular until years after I implemented my Ajax-enabled server controls)
Thanks
-Frinny
How and where do you call the _hideBlockingDiv function from? Since you are using MS Ajax library, you might want to have a page loaded handler on client side and call this function from within that handler. So basically
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function(){
_hideBlockingDiv();
});
Hope this helps!
It turns out that the problem only exists in the beta version of IE9 that I was using at the time. This problem went away once the full version of IE9 was released.
精彩评论