JavaScript runtime error: Unable to get property 'open' of undefined or null referenc

i get the error

JavaScript runtime error: Unable to get property ‘open’ of undefined or null referenc
at line
container.document.open(“text/html”);

usibg mm_menu 20MAR2002 Version 6.0

  • Andy Finnell
    mm_menu.js

how do i rectify

It seems that the container has not been correctly assigned.

how to assign it
sld i send the js file?

If you can simplify a test page down to the minimum of content that is required to demonstrate the problem, then that would be a good thing for us to take a look at.

its working in Firefox
but the above error in IE

That’s nice, but as Paul suggests, we need to see enough code that we can reproduce the problem.

Wow, I’ve been having exactly the same issue this past week. Basically the dropdown/popout menu on a legacy site will not open in the current release of IE but it works in all other browsers. IE’s Developer Tools says: “SCRIPT5007: Unable to get property ‘open’ of undefined or null reference”

  • I have found that turning on IE’s Compatibility Mode will get my dropdowns back, but I can’t expect every single user who get’s this issue to think of that.

There was an IE10 update on May 14th and this particular issue has never been a problem before last week (that I can recall) so I feel like it has something to do with the current stable release.

This is the version info for the dropdown menu script:

/**
 * mm_menu 20MAR2002 Version 6.0
 * Andy Finnell, March 2002
 * Copyright (c) 2000-2002 Macromedia, Inc.
 *
 * based on menu.js
 * by gary smith, July 1997
 * Copyright (c) 1997-1999 Netscape Communications Corp.
 *
 * Netscape grants you a royalty free license to use or modify this
 * software provided that this copyright notice appears on all copies.
 * This software is provided "AS IS," without a warranty of any kind.
 */

Screenshot of IE’s error message:

Thanks - now we know that the problem lies with mm_menu.js
Some discussion about this problem occur at http://www.blakepell.com/Blog/?p=589 but no good consensus is reached.

I’m away from the computer, but this helps to give some direction to things so that a good and workable solution may be arrived at.

if we do come up with a viable solution we may want to let the Adobe community know about this as well. http://forums.adobe.com/thread/1172300

I’ll try to put together a simplified example page soon, just haven’t had a chance yet.

Blake’s blog entry did pop up in my Googling of this but that didn’t seem to be the same issue. There was only one place in mm_menu.js that it was possible to put “document.all” at the end and that didn’t work in my testing.

Here is the simplified HTML (below) and the full javascript file attached:

*The javascript mm_menu.js is attached as a text file, just remove “.txt” from the filename and put it in the same folder as the HTML.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<STYLE TYPE="text/css">
	a:link { color:#333399; text-decoration: none }
	a:active { color:#660000; text-decoration: none }
	a:visited { color:#333399; text-decoration: none }
	a:hover {color:#660000; text-decoration: none }
	body {margin-left:110px;}
	</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Broken IE Menu</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function mmLoadMenus() {
  if (window.mm_menu_0411130359_0) return; // Needs to match first menu list below?  
  
  // Menu One List
  window.mm_menu_0411130359_0 = new Menu("root",208,17,"Arial, Helvetica, sans-serif",11,"#FFFFFF","#FFFFFF","#333399","#660000","left","middle",3,0,1000,-5,7,true,true,true,2,true,true);
  mm_menu_0411130359_0.addMenuItem("One","location='one.html'");
  mm_menu_0411130359_0.addMenuItem("Two","location='two.html'");
  mm_menu_0411130359_0.addMenuItem("Three","location='three.html'");
  mm_menu_0411130359_0.hideOnMouseOut=true;
  mm_menu_0411130359_0.bgColor='#FFFFFF';
  mm_menu_0411130359_0.menuBorder=0;
  mm_menu_0411130359_0.menuLiteBgColor='#FFFFFF';
  mm_menu_0411130359_0.menuBorderBgColor='#FFFFFF';
  
  // Menu Two List
  window.mm_menu_0411143705_0 = new Menu("root",199,17,"Arial, Helvetica, sans-serif",11,"#FFFFFF","#FFFFFF","#333399","#660000","left","middle",3,0,1000,-5,7,true,true,true,2,true,true);
  mm_menu_0411143705_0.addMenuItem("Un","location='un.html'");
  mm_menu_0411143705_0.addMenuItem("Deux","location='deux.html'");
  mm_menu_0411143705_0.addMenuItem("Trois","location='trois.htm'");
  mm_menu_0411143705_0.hideOnMouseOut=true;
  mm_menu_0411143705_0.bgColor='#FFFFFF';
  mm_menu_0411143705_0.menuBorder=0;
  mm_menu_0411143705_0.menuLiteBgColor='#FFFFFF';
  mm_menu_0411143705_0.menuBorderBgColor='#FFFFFF'; 
  
  mm_menu_0411143705_0.writeMenus(); // Needs to match last menu list above?
} // mmLoadMenus()

function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<style type="text/css">
.style {font-family: Arial, Helvetica, sans-serif; font-size: 13px; }
</style>
<script language="JavaScript" src="mm_menu.js"></script>
</head>

<BODY>
<div align="left">
  <script language="JavaScript1.2">mmLoadMenus();</script>
</div>

<table width="853" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="183" valign="top">
	<table width="183" border="0" cellpadding="0" cellspacing="0" bordercolor="#666666" bgcolor="#EBD1A0">
    <tr>
      <td width="183" bgcolor="#F2E7BF"><p class="style" style="margin-bottom: 0;"><a href="#" name="link8" onMouseOver="MM_showMenu(window.mm_menu_0411130359_0,94,0,null,'link8')" onMouseOut="MM_startTimeout();"> &nbsp; Menu One</a></p></td>
    </tr>
    <tr>
      <td bgcolor="#F2E7BF">&nbsp;</td>
    </tr>
    <tr>
      <td bgcolor="#F2E7BF"><span class="style"><a href="#" name="link12" id="link2" onMouseOver="MM_showMenu(window.mm_menu_0411143705_0,95,0,null,'link12')" onMouseOut="MM_startTimeout();">&nbsp; Menu Two</a></span></td>
    </tr>
    <tr>
      <td bgcolor="#F2E7BF">&nbsp;</td>
    </tr>   
	</table>    
  </tr>  
</table>

</body>
</html>

(Yes, there is a little bit of extraneous CSS style left in the HTML but otherwise this is the very basics.)

From line 294 of mm_menu.js is the problem.

if ((!document.all) && (container.hasChildNodes) && !window.mmIsOpera) {
    container.innerHTML=content;
} else {
    container.document.open("text/html");
    container.document.writeln(content);
    container.document.close(); 
}

Their cross-bowser compatibility code breaks when it comes to working with IE10.

The container is a span element that was written to the page:

document.writeln('<span id="menuContainer"></span>');
container = FIND("menuContainer");

and the FIND function successfully retrieves a reference to the menu container, but in IE10 that element doesn’t seem to have a reference to the document any more.

Is there any chance the javascript code can be tweaked to get it to work in IE10? I’m not entirely sure if the problem section can even be removed without breaking the script altogether. To me it looks like this JS needs to be scrapped, but that would be my very last option for this particular site.

I think that it’s more of an overall design issue, because span’s aren’t supposed to have divs within them.

Use the following in the head of your document, and that will tell IE10 and above to instead work as if they were IE9, which solves your problem.


<meta http-equiv="X-UA-Compatible" content="IE=9" />

Awesome. That is a really smart, simple workaround. Thanks for your help Paul!