Why is this simple link example not working in Firefox? It is working in IE and Chrome.
js fiddle sample
I am using windows XP. My Firefox version is 16.0.
Your fiddle sample shouldn't work in any browser because you've defined the getItems() method inside the onload handler that is the jsfiddle default (as set on the left-hand side) which in turn means that it is not in scope from the inline onclick="getItems()" attribute.
It works in FF if you fix that by selecting no wrap (head) instead of onLoad, thus making your function global: http://jsfiddle.net/u6bKr/1/
(Note that this has nothing to do with href="javascript:void(0);")
My research for getItems() showed what in some situations this function is defined as native function. I don't know why. To avoid this trouble try to rename function getItems.
http://jsfiddle.net/u6bKr/3/
UPDATE:
As specified in comment by Boris Zbarsky this trouble can be also avoided when adding window. before getItems() (e.g. window.getItems()).
Related
EDIT
Added a link to a sandbox with working code. For some reason it seems to be working in the sandbox in the same browser it wont work on?!?!
CodeSandbox Demo
I am experiencing this weird issue of invoking a function in the console and it working as expected. However, when I invoke the function via an event listener it breaks the element.
The element is a canvas that is drawing different "bodies" on to it over a set interval.
Why would cause this function to work in the console but not in the document?
Two questions and then I might be able to help you.
Number 1: Are you using a library like p5.js or are you drawing it straight onto the canvas?
Number 2: Could you please post the code, as there might be an error?
Also if you want a quick solution, try using a different browser (although this might not be the solution, it is worth a try), such as Firefox Developer Edition, or just regular Firefox.
Hope this is helpful!
IE so much confusing me with some errors like this,
SCRIPT1002: Syntax error
File: jquery-2.1.4.min.js, Line:2 Column 2538
The weird thing is , on firefox and chrome running well and no error.
And some button with jquery click function is working.
I'm Using IE 11
Before this i'm using jquery-1.1.13.min.js and when i use jquery 2.0 it still running properly on firefox and chrome
I'm really new with cross browser so any info will helping me very much, thanks :)
For the record I had this error which only showed itself on IE when doing cross-browser testing of a big Javascript code change.
In my case the problem was a function definition which included what would be a default in any other language:
i.e. Function Foo(param1, param2, param3=false)
.. clearly this was a stupid bit of code .. but it took me a while to track down so this might help someone out there. Doesn't show up in Chrome, FF, or even Edge.
Mostly these errors are not problems of jQuery itself. The problem situates in code using jQuery or inserted into jQuery (callbacks or event functionalities). In my case I used $.ajax to load a remote page in a div element. In the page I loaded there where // comment tags in the javascript part. As IE is putting this content on one line, more code that as I wanted was commented and this created the error.
So if in our case us are using $.ajax maybe this can be an issue. Otherwise best thing to do is debugging the code that generates this error and look for code that is not supported by IE (the version you use). Look for functions passed trough to jQuery.
I have added a piece of javascript code and it is not getting reflected in some of my peer's machine. Don't know whats going wrong.
This is what I did.
OnClick of a button, there was an existing JS function and I added an overlay feature inside the click event like,
function existing() {
var testDate = document.getElementById('test');
......
.....
newOverlay(); // This is the newly added function
}
I defined the newOverlay() as
function newOverlay(){
document.getElementbyId('divId').style.display = 'block';
}
I have defined the new function above the existing() and both the functions are inside the head tag
When I check this change in my local environment, it was working fine and there was no issues. When I deployed to the server, it was working fine for me and my peer could not see the change in firefox. But, he can verify the change in IE and Chrome.
We were thinking of some cache in the browser and we cleared the cache (ctrl+shft+del --> Everything) and tried. The issues occurred again. The part I added was not in the DOM itself. We tried Ctrl+F5, but it was not helpful.
When we reset the firefox browser and tried, the change got reflected and it was working fine. Don't know what was exactly happening. The issue is still occurring in some of our machines. Kindly share your thoughts.
Note: The entire JavaScript is inside a JSP and all are using the same version of Firefox (latest)
Try double quoting in the getElementById(). "id_name" instead of 'id_name'. Sometimes browsers are prone to this kind of bugs.
I recently launched a website for a client http://www.bridgechurch.us/ only to recieve complaints of it not displaying correctly on ie8 or ie9. I have confirmed this to be true. IE is pointing to this line of Javascript:
jQuery(function () {
jQuery(".scrollable").scrollable({circular: true}).navigator().autoscroll({interval: 7000});
[...]
Can anyone help me figure out what is wrong with this line of code?
Thank you
UPDATE - FIXED
I figured out that there was a comment before the Doctype Declaration that forced IE into quirks mode.
You have a lot of 404's on that page, mainly related to ie-specific css and border images, which is probably why the page doesn't look like it should. Files like /images/internet_explorer/borderBottomRight.png and /wp-content/themes/Moses/styles/default.css aren't loading.
That being said, looking at the scrollable documentation, there is no .navigator() function off of the return value of scrollable(); and I'm getting the same error in Chrome.
Well, visually, the site doesn't appear to work well at all in IE9 (compared to Chrome). But just looking at the code that adds scrollable() to jQuery, you can see that that function doesn't always return the original element. In your code, if you split the call into two, you might be ok:
jQuery(".scrollable").scrollable({circular: true});
jQuery(".scrollable").navigator().autoscroll({interval: 7000});
I blame the plug-in on this one: functions that extend jQuery are supposed to always return the original elements found by the selector.
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?