Follow-up code after the CSS has finished loading

Recently in the framework of writing the project, write a Jquerymessagebox class to use dialog () in the jquery UI to display the message box, in order to make the method convenient to call, then added the automatic Judgment page joins the Ui.js and Ui.css, the code is as follows:

[JavaScript]View Plaincopyprint?

2. If the ui.js is not included, the reference
4. if ($ (' script[src$= "" "Jquery-ui-1.8.11.custom.min.js" "]"). Length = = 0) {{
6. $ ("" <script src='/js/jquery-ui-1.8.11.custom.min.js ' type=' text/javascript '/> '). AppendTo (  ' head ');
8. }}
10. If the CSS is not loaded, the load
12. if ($ (' link[ref$= "" "Jquery-ui-1.8.14.custom.css" "]"). Length = = 0) {{
14. $ (' <link href= ' ""/css/jquery-ui-1.8.14.custom.css "" rel= "" Stylesheet "" type= "" Text/css ""/> "). AppendTo (  ' head ');
18. Dialog () script
20. }}

But the CSS code will not be loaded immediately, so when the display dialog will not have the style (under IE9, because in the IE9 under the CSS even after downloading, will also redraw the page elements, and IE8 will not). To solve this problem, you can use Ajax, when the CSS is loaded, and then display dialog, so that you can show the style, the code is as follows:

[JavaScript]View Plaincopyprint?

2. if ($ (' link[ref$= "" "Jquery-ui-1.8.14.custom.css" "]"). Length = = 0) {
4. $.ajax ({
6. URL: '/css/jquery-ui-1.8.14.custom.css ',
8. Success: function (data) {
10. //Create a STYLE element and append it to the head
12. //Replace the path where images
14. $ (' <style type= ' text/css ' > ' + data.replace (/url\ (images/g, ' url (/css/images ') + ' </style> ').  AppendTo (' head ');
16. //dialog () script;
18. }
20. });
22. }
24. else {
26. //dialog () script;
28. }

Follow-up code after the CSS has finished loading