Unable to get property 'replace' of undefined - only in IE9 - javascript

I only receive this error in Internet Explorer 9. IE7, IE8 and IE10 run the script fine. It is a banner of fading images, one after the other all stacked and fade in to each other.
When you attempt to load the page on IE9, it throws an error. The error occurs within prototype.js and I get this error.
SCRIPT5007: Unable to get property 'replace' of undefined or null reference
prototype.js, line 334 character 24
Why would this happen in IE9 but not any earlier version??

I was getting the same error message, because I was using a .html() operation on an XML tag.
var myXML = '<someTag att1=""><cell></cell></someTag>' ;
$(myXML).html(); // which was giving the error msg.
// Instead use the below option
$(myXML).children() ;// instead this work with IE
Note: Above example is not what I actually tried, it's just to give a representation of the problem.

You should try using the X-UA-Compatible tag. Many libraries do not work well with IE9 and need to be run in IE8 compatible mode.
<meta http-equiv="X-UA-Compatible" content="IE=8" />

I've resolved the issue after a few hours of hair pulling and teeth grinding.
I did not realize that scriptaculous was reliant upon prototype.
I was updating prototype while leaving an outdated version of scriptaculous effects linked which was throwing many errors.
After updating to scriptaculous 1.9 and then updating prototype to 1.7, all was well and no errors are thrown.
Thank you all to those who helped, I appreciate all the comments!

Well, most of the time this error occures because of the .html() operation in jquery to parse XML. Remove this and use .text() instead will solve the problem.

Related

IE9 jQuery load order issue

I have a page that is quite jQuery reliant.
The functionality on the page works fine in all browsers, except IE9.
This I understand is down to the issue with IE9 where Javascript can load very slowly.
The problem I face is that the page, once loaded thinks that Javascript is not available.
An error I am seeing in the console is:
SCRIPT5007: Unable to get property 'length' of undefined or null reference
File: jquery-1.8.3.min.js, Line: 2, Column: 14331
For the record, the jQuery lib is loaded before any other js files.
I have tried to get around this issue by adding the following code into the head, to try and force IE9 into IE8 mode. Note by default for IE we force 'edge' mode.
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--[if IE 9]>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<![endif]-->
However, this makes no difference.
Before anyone asks why we're relying on IE9, it is a business requirement.
Does anyone have any idea how I can get the page to render in IE8 mode if the bowser accessing the page is IE9?
Many thanks in advance.
I should add, the page in question has a 'noscript' check on it, so will not render if JS is not available. This is true ONLY in IE9. For all other browsers, the page will render fine.
I'm wondering if the above error is something else...
For the record, I have been looking at this IE9 JavaScript error: SCRIPT5007: Unable to get value of the property 'ui': object is null or undefined thread.
As I understand it, this is an issue with jQuery under IE9, which was fixed at some point after jQuery 1.8.3.
So the issue can, in all probability, be fixed by using a later version of jQuery.
At this time, I would opt for jQuery 1.11.0. Don't be tempted by the 2.x series, which deliberately omits lots of backward compatibility stuff.
Unfortunately, this will mean requalifying everything that uses jQuery, which is a pain.
OUr issue was down to IE not recognising the 'console' command.
As we were running a number of console.log commands, when this part of the code was reached in IE9, it stopped, and prevented any other JS from loading.
So the fix we have implemented is: If console not defined (IE9), define an empty object literal
if(!(window.console && console.log)) {
console = {
log: function(){},
debug: function(){},
info: function(){},
warn: function(){},
error: function(){}
};
}
This seems to be working for us now. :)

jQuery 1.11.1 appendChild error IE8 (Unexpected call to method or property access)

SOLVED: I was appending to SECTION tag, whereas IE8 doesn't support this tag, parsing it as text/non-closed html tag, infamous cause to halt append! so I added a condition that creates HTML5 elements for IE versions below 9, as portrayed here and the problem went away, it actually fixed a bunch of other bugs as well! http://tatiyants.com/how-to-get-ie8-to-support-html5-tags-and-web-fonts/
Sorry everyone. :(
Testing a new website I built on IE8, using jQuery v1.x (1.11.1). Using HTML5, code is validated.
I have this snippet inside a success function of an ajax function:
$('.product_details_contact_form_wrapper').detach().appendTo('#primary');
For some reason, under Chrome and Firefox it's all dandy, IE11 as well. Problem occurs when I set IE11 to emulate IE8. Then, I get a script pause and IE is complaining over appendChild in the jquery library code:
IE11(8) Inspector directs to b.appendChild(a), marked with yellow and:
"Unexpected call to method or property access." marked with red, beneath it.
Sorry for the time it took me to update this question. Ok, so the ultimate solution to this problem was adding html5shiv to my project. That's it. Ignore my previous comments.

getComputedTextLength throws an error in IE10

I'm writing a unit test that uses getComputedTextLength() and test passes in all browsers except IE (i'm using IE10).
Any ideas?
This is the error im getting: Unexpected call to method or property access.
You could fallback to calling getBBox() and look at the width field of the result for IE10. It isn't quite the same but it's better than nothing I guess.
This occurs when the element is not in the visible DOM. You can do a check before hand to avoid having to use try/catch.
if(!document.body.contains(self.node())) return;
In my limited investigations it seems IE11 (so I assume IE10) throws this error when the actual element is not visible. To get around this problem I did
var a;
try{
a=textElement_.getComputedTextLength();
}catch(e){
a=textElement_.childNodes[0].length*8; //I used 8 as a width, but you should experiment
}
I hope this helps. Once the element is visible it seems to use getComputedTextLength normally.
If you call "el.getSubStringLength()" in a SVG in an iframe. Then you refresh this iframe, IE will also complain about this, but refreshing the whole page will work just fine.
I guess this was because the text element is already in the DOM, and there is a bug between these update worker.

Javascript error for ie9 - flickrshow gallery

I have a page with two flickrshow galleries on it. They both work fine in FF, Chrome, Safari, ie6+ but not ie9. I am fixing various js problems by using
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
to emulate ie8. Problem is that there is still an error for the js and ie is throwing up the 'webpage error, do you want to debug' message each load.
Using the Debugger, error is:
SCRIPT5007: Unable to get value of the property 'removeChild': object is null or undefined
flickrshow-7.2.min.js, line 11 character 4468
The line of the flickrshow js that gets highlighted with the error on:
a.elements.script.parentNode.removeChild(a.elements.script)
Suggestions please, thanks
Since you haven't given much context for your code. Try logging a.elements.script.parentNode and a.elements.script and a to see if you actually are getting the elements your expecting. From the error I assume since it has something to do with IE not getting the HTML element correctly. However, it could be something with a I'm assuming it is a variable for something, but I'm not sure what.

Why isn't jQuery $('.classname') working in IE?

With valid HTML the following finds the object as expected in all browsers but gets NULL in IE (6 & 7).
$(document).ready(function() {
alert( '$(.rollover):\n' + $('.rollover'));
});
I've tried by switching it to something simpler like $('a') but I always get NULL in IE.
Update:
After running the page through the W3C validator (and ignoring what my Firefox validator plugin was telling me) it appears there are actually quite a lot of validation errors (even with HTML 4 Transitional defined), which I can't easily fix, so my guess is that is the cause of my issues. As trying on a very simple document works as expected in IE.
If you're having $ conflicts there are many way to avoid this as documented here.
It seems that it is AjaxCFC's JavaScript includes that are causing a problem, more specifically the ajaxCFC util.js which seems to define it's own $.
Moving those includes before that of the JQuery lib fixed the above issues I was having.
I think we'd have to see the HTML. I've never had a problem with class selection in jQuery/IE. You should get [object Object] for the jQuery object in the alert. Also, are you using an old version of jQuery?

Categories

Resources