Javascript in IE vs Firefox - javascript

The following script works fine in IE7 but fails to execute in Firefox 3. The div tag which was display: none; shows in IE but never in FF. I am not a client / javascript guy... thanks.
<script type="text/javascript">
//<![CDATA[
document.getElementById("Fred1_Panel").style.setAttribute("display","inline");//]]>
</script>

try this:
document.getElementById("Fred1_Panel").style.display = '';
OR
document.getElementById("Fred1_Panel").style.display = 'inline';

This will work in both browsers:
document.getElementById("Fred1_Panel").style.display = 'inline';

In FF, starting with either Tools | Error Console, or FireBug's console is a good way to see what errors are occurring.

This code should work:
document.getElementById("Fred1_Panel").style.display = "inline";
In general if you encounter problems in Firefox you can easily discover the exact problem (and maybe find out the solution) using Firebug plugin or simply seeing at the Error console.

Related

IE 7/8 Javascript issue

Hi i hope you can help me
I am having an issue in IE 7/8 with the rock solid template. See the template http://www.pixelsparadise.com/showcase_2013/#load=http://www.rocksolid.joomlatemplates.info
It seems to be caused by JavaScript code in the header.
The error code i receive in the IE debugger is
SCRIPT1014: Invalid character
<script type="text/javascript">document.getElementById("sectors").addEventListener('change', function () {
window.location = this.value;},false); ​</script>
This is the piece of code seemingly causing the problem.
Basically the area stops any button used within the template from working. Any ideas how to fix this for Internet Explorer 7/8?
Thanks
You have an extra, "invisible" (it can be seen if you copy that code into something like Notepad++) character just before the </script> tag; just delete everything between the ; and </script> and it should be resolved.
take out the space in the script tag closure
​</script>
change to
<script type="text/javascript">document.getElementById("sectors").addEventListener('change', function () {
window.location = this.value;},false); </script>

Iframe onclick not working in Firefox and Opera

I am trying to attach an onclick event to an iframe that is in editable mode using the JavaScript and HTML code below. The code works fine in IE8, Safari, and Chrome, but does not work in Firefox or Opera. I have spent several hours doing some research, rewriting the code, and testing every idea that I can think of, all without success. So far, I have only been able to work out that line 8 might be the root of my problem. Can anybody tell me what I may be doing wrong and offer me any tips or code samples to help solve my problem? Any help would be appreciated.
Here is my code;
<html>
<head>
<script type="text/javascript">
function iFrameOn(){
document.getElementById("wysiwyg").contentWindow.document.designMode = 'On';
}
function iFrameEvent(){
document.getElementById("wysiwyg").contentWindow.document.body.onclick = function(){
alert('Hello world!');
}
}
</script>
</head>
<body onload="iFrameOn()">
<iframe name="wysiwyg" id="wysiwyg" onload="iFrameEvent()"></iframe>
</body>
</html>
You must use contentWindow and contentDocument to support all browsers:
var frame = document.getElementById('wysiwyg');
if(frame.contentWindow) {
//
} else if(frame.contentDocument) {
//
}
I believe that contentWindow was a property that IE initally implemented that other browsers may have started supporting at some point but I believe the standard is contentDocument.
Someone here has posted a cross-browser solution:
Chrome: Getting iFrame and inserting into body

document.body.onload in Firefox

Okay so I'm using Javascript to set the onload attribute of a page. It works in IE but not Firefox. Does anyone know a fix for this? Neither IE or Firefox is throwing an error. I'm using the Firefox plugin "Web Developer" and it isn't showing any JavaScript errors. Code below: Thanks.
document.body.onload = setRedirect;
function setRedirect()
{
alert("TEST");
}
Change to:
window.onload = setRedirect;
Also see this jsfiddle.

Internet Explorer 7 + alert() doesn't work

Can some of you please tell me why a simple alert() isn't working using jQuery 1.4 in Internet Explorer 7, when it's working in all other browsers? It's been driving me crazy now for the last half an hour..!
$(document).ready(function(){
alert("wtf?");
})
This simple example doesn't show an alert in IE7. See for yourself at http://jsfiddle.net/8HQdp/.
Ensure your console doesn't show any errors and correct them if there are any.
Be sure you didn't disable browser prompts on IE
Try using window.alert() - it's possible (though improbable) that another alert() is conflicting with window's.
If you have console support, try console.log(alert); and see what it says. It should be something like:
function alert() {
[native code]
}
I'm using IE8 but with IE7 mode, the alert on http://jsfiddle.net/8HQdp/ still triggers.
Try changing $ to jQuery and host your own jquery.js.
And also try console.log('wtf') before alert so u know whether it's alert or document.ready is broken.
It works in IE 7 mode in IE 8 form me. Takes a while but it does trigger.
I noticed that there is a semi colon missing from the ready function. should be...
$(document).ready(function(){
}); //missing semicolon here
Also, try using the shortcut for the DOM ready function...
$(function(){
// code here
});
Try using window not document.

jQuery $ is not a function in Firefox, works in Chrome and works with $(document).ready()

I'm implementing jQuery in a site and am getting the "$ is not a function" in Firefox when I try to use a selector, but $(document).ready() works perfectly right before it. My code looks like this
<script>
$(document).ready(function(){
alert("hi")
}); // Works fine
function showDiv(){
$("#traditionalCC").hide();
}
//Throws error
</script>
Does anyone know why this happens, and why it works in Chrome and Firefox.
The key difference between your two examples (the working and non working ones) is that the first one is using the document ready event. That happens when the page is fully loaded. Not sure when you're other one is getting invoked, but my guess is that it is being called before your <script> tag include for jquery.js itself.
Try
<script>
$(function() {
alert("hi")
}); // Works fine
function showDiv(){
$("#traditionalCC").hide();
}
//Throws error
</script>
Try to use
$(document).ready(function() {
$ = jQuery.noConflict();
});
Fix your script declaration to <script type="text/javascript">
Verify if your script is after the jQuery lib include.
I hope it help.
I have found that sometimes Firefox gets "hosed" and I have to quit and relaunch.
In case anyone comes across this in the future, the problem was FireBug. I uninstalled and reinstalled and the issue went away.

Categories