Script elements written with document.write in a window that opens with window.open are not executed in IE8 on Windows 7

I had a problem that seems to only appear on Windows 7. It seemed to work fine in IE8 on another version of Windows. Basically, I create a new window with window.open (), and then use document.write () to write the contents of this new window that contains the script. In IE, these scripts do not execute properly. Most of the time they are not executed at all, but sometimes one of them will be. This is only with a cleared cache - once the javascript files are in the cache, it works fine.

Collapsed test case:

test.html:

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> <html> <head> <script type="text/javascript"> var w = window.open(); var windowHTML = "\ <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'>\n\ <html>\n\ <head>\n\ <script type='text/javascript' src='test.js'></scr"+"ipt>\n\ <script type='text/javascript' src='test2.js'></scr"+"ipt>\n\ </head>\n\ <body>\n\ </body>\n\ </html>"; w.document.write(windowHTML); w.document.close(); </script> </head> <body> </body> </html> 

test.js:

 alert("test"); 

test2.js:

 alert("test2"); 

When I go to test.html, I expect a new warning window to appear for "test", then "test2". I do this in most browsers, including IE6. However, when I try to do this in IE8 in Windows 7, it opens a blank page, but no warnings appear (or sometimes only one).

Is this some kind of time problem? Has anyone else seen this? Is there any way around this?


Edit: Here is the code I tried that Rob Cooney wanted to see. Again, it works in other browsers, but not in IE8 on Windows 7.

test.htm:

 <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> <html> <head> <script type="text/javascript"> var w = window.open(); var windowHTML = "<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'>\n" + "<html>\n" + "<head>\n" + " <script type='text/javascript' src='test.js'></scr"+"ipt>\n" + " <script type='text/javascript' src='test2.js'></scr"+"ipt>\n" + "</head>\n" + "<body onload='test();test2()'>\n" + "</body>\n" + "</html>"; w.document.write(windowHTML); setTimeout(function() { w.document.close(); }, 10000); </script> </head> <body> </body> </html> 

test.js:

 function test() { alert("test"); } 

test2.js:

 function test2() { alert("test2"); } 

Also, I posted this as a question on the MSDN forums here .


Deciding rejection as the best answer. Here is my modified code:

 <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> <html> <head> <script type="text/javascript"> var w = window.open(); var windowHTML = "<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'>\n" + "<html>\n" + "<head></head>\n" + "<body></body>\n" + "</html>"; w.document.write(windowHTML); w.document.close(); var s = w.document.createElement("script"); s.type = "text/javascript"; s.src = "test.js"; w.document.getElementsByTagName("HEAD")[0].appendChild(s); var s2 = w.document.createElement("script"); s2.type = "text/javascript"; s2.src = "test2.js"; w.document.getElementsByTagName("HEAD")[0].appendChild(s2); </script> </head> <body> </body> </html> 

Note. the thing to keep track of this solution is that javascript files are now loaded asynchronously, so if you have dependencies between the files, you cannot be sure that they will be loaded in the correct order. I went around this with setTimeout and tested for the presence of variables in the first file before loading the second file.

+7
javascript internet-explorer windows-7
source share
3 answers

Try something like this (untested):

 var s=document.createElement('script'); s.type = "text/javascript"; s.src = "test.js"; document.body.appendChild(s); 
+6
source share

Perhaps you should consider wrapping warning calls in function definitions in imported js files, and then add onLoad to the body tag of the HTML window that calls the function

EDIT:

 <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> <html> <head> <script type="text/javascript"> var w = window.open(); w.document.writeln("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">"); w.document.writeln("<html>"); w.document.writeln("<head>"); w.document.writeln("<script type=\"text/javascript\" src=\"test.js\"></scr"+"ipt>"); w.document.writeln("<script type=\"text/javascript\" src=\"test2.js\"></scr"+"ipt>"); w.document.writeln("</head>"); w.document.writeln("<body onload=\"test();test2()\">"); w.document.writeln("</body>"); w.document.writeln("</html>"); w.document.close(); </script> </head> <body> </body> </html> 
+1
source share

I'm not sure what your goal is to bring up a popup ... if you don’t need to have a separate window, you can try to layer on an existing page. Some people call it the illuminator.

The window.open function in some browsers will first prompt the user to “accept the pop-up window” (which I find annoying), if you do not need the pop-up window and you can implement everything on one page, you can use jQuery.load to load the contents into the container instead ( without reloading the page).

http://api.jquery.com/load/

-one
source share

All Articles