Someone789 Posted September 9, 2008 Share Posted September 9, 2008 Hello, I have just created a javascript code that acts as a very simple time zone converter. The page I need to place it on has the following doctype which cannot be changed: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Here's the issue in a nutshell: >If I use the code in IE WITHOUT the doctype, it works perfectly. >If I use the code in IE WITH the doctype, it works perfectly. >If I use the code in Firefox WITHOUT the doctype, it works perfectly. But here's the problem - If I use the code in Firefox WITH the doctype, it doesn't work at all. The complete code is listed below: <div align="center"> <table border="5" cellpadding="5" bgcolor="navy"> <tr><td align="center"> <font size="5" color="white"><i><b><u>Time Zone Converter</u></b></i></font> <form name="Calc"> <script> function run() { if (Calc.enter.value == 12) { timing = "0"; } else { timing = Calc.enter.value; } if (Calc.enter.value > 12 ¦¦ Calc.enter.value < 1) { Calc.output.value = "Invalid"; } else { place = (timing - Calc.select1.value)+Calc.select2.value*1; if (Calc.selecter.value == 2 && place > 11.9 && place < 23.9) { tracker = "AM"; } else if (Calc.selecter.value == 2 && place > 23.9) { tracker = "PM"; } else if (Calc.selecter.value == 2 && place < 11.9 && place > -.1) { tracker = "PM"; } else if (Calc.selecter.value == 2 && place < -.1 && place > -12.1) { tracker = "AM"; } else if (Calc.selecter.value == 2 && place < -12.1) { tracker = "PM"; } else if (Calc.selecter.value == 1 && place > 11.9 && place < 23.9) { tracker = "PM"; } else if (Calc.selecter.value == 1 && place > 23.9) { tracker = "AM"; } else if (Calc.selecter.value == 1 && place < 11.9 && place > -.1) { tracker = "AM"; } else if (Calc.selecter.value == 1 && place < -.1 && place > -12.1) { tracker = "PM"; } else if (Calc.selecter.value == 1 && place < -12.1) { tracker = "AM"; } if (place > 24) { Calc.output.value = place-24 + ":" + Calc.enter2.value + " " + tracker; } else if (place > 12) { Calc.output.value = place-12 + ":" + Calc.enter2.value + " " + tracker; } else if (place > 0) { Calc.output.value = place + ":" + Calc.enter2.value + " " + tracker; } else if (place > -12) { Calc.output.value = place+12 + ":" + Calc.enter2.value + " " + tracker; } else if (place > -24) { Calc.output.value = place+24 + ":" + Calc.enter2.value + " " + tracker; } } } </script> <font color="white"><b>Time of the Event: </b></font> <input type="text" name="enter" SIZE="1" maxlength="2" onChange="run()"> <font size="5" color="white"><b>:</b></font> <input type="text" name="enter2" SIZE="1" maxlength="2" onChange="run()"> <select name="selecter"> <option name="AM" value="1" onClick="run()">AM</option> <option name="PM" value="2" onClick="run()">PM</option> </select> <select name="select1"> <option value="-7" onClick="run()">Pacific USA</option> <option value="-6" onClick="run()">Mountain USA</option> <option value="-5" onClick="run()">Central USA</option> <option value="-4" onClick="run()">Eastern USA</option> <option value="0" onClick="run()">GMT/UTC</option> <option value="1" onClick="run()">BST</option> <option value="8" onClick="run()">Western Austrailia (AWST)</option> <option value="10" onClick="run()">Eastern Austrailia (AEST)</option> </select> <br><br> <font color="white"><b>Converted to:</b></font> <select name="select2"> <option value="-7" onClick="run()">Pacific USA</option> <option value="-6" onClick="run()">Mountain USA</option> <option value="-5" onClick="run()">Central USA</option> <option value="-4" onClick="run()">Eastern USA</option> <option value="0" onClick="run()">GMT/UTC</option> <option value="1" onClick="run()">BST</option> <option value="8" onClick="run()">Western Austrailia (AWST)</option> <option value="10" onClick="run()">Eastern Austrailia (AEST)</option> </select> <font size="4" color="white"><b>=</b></font> <input type="text" readonly="readonly" name="output" SIZE="6"> <input type="button" onClick="run()" value="Convert!"> </form> </td></tr> </table> </div> It seems that some part of the script is somehow incompatible with the doctype only in Firefox, but I've tried many things so far that simply haven't worked. Could someone please take a look at this and see if there is any reason as to why this works in IE, but not in Firefox? Help would be greatly appreciated. Thanks! Link to comment https://forums.phpfreaks.com/topic/123379-solved-doctype-messing-up-javascript-code-in-firefox/ Share on other sites More sharing options...
JasonLewis Posted September 9, 2008 Share Posted September 9, 2008 I would use document.getElementId() and start giving input tags id's. And I have a feeling it should be document.Calc.enter.value Not sure if the document. will make a difference but give it a shot. Link to comment https://forums.phpfreaks.com/topic/123379-solved-doctype-messing-up-javascript-code-in-firefox/#findComment-637291 Share on other sites More sharing options...
RichardRotterdam Posted September 9, 2008 Share Posted September 9, 2008 try using "onchange" instead of using onclick on every option <select onchange="run"> <option>1</option> <option>2</option> <option>3</option> </select> Link to comment https://forums.phpfreaks.com/topic/123379-solved-doctype-messing-up-javascript-code-in-firefox/#findComment-637292 Share on other sites More sharing options...
Someone789 Posted September 9, 2008 Author Share Posted September 9, 2008 I would use document.getElementId() and start giving input tags id's. And I have a feeling it should be document.Calc.enter.value Not sure if the document. will make a difference but give it a shot. Thanks, that was it. I just defined Calc as document.Calc by imputing this single line: Calc = document.Calc; And it all works great now. Link to comment https://forums.phpfreaks.com/topic/123379-solved-doctype-messing-up-javascript-code-in-firefox/#findComment-637955 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.