Does anyone know why this would not work in IE7/8?

drop_area = $('div#drop_area');

It works perfectly in IE9, FF2/3, and Chrome. Internet Explorer 7/8 gives the following error:

SCRIPT438: Object doesn't support this property or method 

Edit: This is the HTML that goes with my javascript:

Does anyone know why this would not work in IE7/8?

drop_area = $('div#drop_area');

It works perfectly in IE9, FF2/3, and Chrome. Internet Explorer 7/8 gives the following error:

SCRIPT438: Object doesn't support this property or method 

Edit: This is the HTML that goes with my javascript: http://pastebin./nwxx8RzW

• javascript
• jquery
• internet-explorer-8
• internet-explorer-7
• cross-browser

• 1 May be its some other piece of code...Can u post the rest of the code? – Chandu Commented Jun 29, 2011 at 22:41
• 2 You don't need the div portion of the selector, since the ID is unique. – Gert Grenander Commented Jun 29, 2011 at 22:43
• 1 Stupid question, but have you tried var drop_area = $('div#drop_area');? Also, are there any other errors reported? Have you tried pasting your code into JS Lint and checking for errors there? – David Thomas Commented Jun 29, 2011 at 22:43
• @Cybernate, sure I can post it. But I'm thinking this particular line is the only relevent bit since when I set a breakpoint it crashes right here. Complete script: pastebin./dL8zSiV7 – Casey Flynn Commented Jun 29, 2011 at 22:43
• Assuming you have <div id='drop_area'>...</div> somewhere it works fine for me in IE 8. – glortho Commented Jun 29, 2011 at 22:43

4 Answers 4

IE has a weird behaviour to register some properties in global scope. Elements with an given ID may be accessed simply by using the ID.

So you have a element with the ID "drop_area", it's accessible in IE by using this ID, try:

alert(drop_area.tagName)

..to check it.(should give "DIV")

So what happens: You try to assign something else to this element when using drop_area = $('div#drop_area'); , but this is an invalid operation on an DOMElement.

So use the var-keyword to clarify that you want to create a variable

var drop_area = $('div#drop_area');

or in the case that you have to create a global variable inside a function, assign the variable to the global context:

window['drop_area'] = $('div#drop_area');

The code you've shown on pastebin has numerous global variable issues. In other words, you are coding assuming that variables you are declaring are local in scope, whereas in reality they turn out to be global. Examples include set, box_handle, elements, i, id, drop_area, element, row, image_id, etc. All of your functions are global in scope as well, when they can easily be encapsulated in an other function.

Now I don't know if there's some subtle interactions going on, whether some code has hammering (global) data set by other code, but it certainly seems as if something is getting overwritten and hence methods and properties are disappearing. I would start by going through the code and adding var to local variables. Next I'd be encapsulating most of this code in an anonymous autoexecuting function.

Usually that error shows, that you use jQuery on a website that also uses Prototype. That's why get an error (which is actually throw by Prototype). The other possibility is, that you try to call the code, before the jQuery lib was included into the HTML.

To make sure it's not my first guess, add this code to your JS code:

$.noConflict();

Therefore it is important that Prototype is included into the HTML, before jQuery is included: http://api.jquery./jQuery.noConflict/

If you than replace all occurrences of $() with jQuery() and it works, it was the first issue with using jQuery and Prototype at the same time.

Have you got an element with an id of 'drop_area'? ie 6/7/8 auto assigns a global var to the dom element using the element id. Some more code would be helpful.