<html> <head> <title>Port Scanner for Mozilla Firefox</title> </head> <body> <form name="my_form" id="my_form" method="post" action="#" onsubmit="return displayMessage();"> <p align="center">URL/Domain Name/IP Address: <input type="text" size="20" name="uri" value="" placeholder="http://www.google.com" required/></p> <table align="center" border="1" width=100% bgcolor="#f4fff0" bordercolor="green" cellspacing="2" cellpadding="2"> <tr> <td align="center"> Start port: <input type="text" size="5" name="start_port" maxlength="5"> End port: <input type="text" size="5" name="end_port" maxlength="5"><br> <input type="submit" value="Scan all ports" name="scan_all"><br> <input type="submit" value="Scan only open ports" name="scan_open"> </td> </tr> <tr> <td align="center"> <input type="text" size="20" name="scan_tcp"><br> <font color="#b1b1b1">Enter port numbers separated by space. (e.g. 21 25 80)</font><br> <input type="submit" value="Scan TCP ports" name="scan_tcp_ports"> </td> </tr> <tr> <td align="center"> <input type="submit" value="Scan common service ports" name="scan_common_tcp"><br> <input type="submit" value="Scan common Trojan ports" name="scan_common_trojan_tcp"> </td> </tr> </table> </form> <script type="text/javascript"> function displayMessage() { if(document.my_form.uri.value==0) { document.write("<font color='red'><i>Please enter URL/Domain Name/IP Address.</i></font>"); return false; } document.write("<DIV id='loading'><BR><BR><font color='#FF6600'><i>Please wait... The ports are being scanned...</i></font></DIV>"); document.getElementById("my_form").submit(); } window.onload=function() { document.getElementById("loading").style.display="none"; } </script> </body> </html> I want to submit above form. But it shows me JavaScript error in Console that "TypeError: document.getelementbyid(...) is null" This error is for code : document.getElementById("my_form").submit(); I am using Firefox 24.0 and Windows 7. I have installed only 1 add-on. That is 'Firebug 1.12.3'. This code works fine for other browsers Except Firefox. Please help me to solve this problem.
document.getElementById("loading").style.display="none"; causing error because "loading" not available in onload function.
Elements created with document.write do NOT exist on the DOM until AFTER </script> ends. This is actually one of the reasons you're NOT supposed to use document.write or innerHTML anymore and instead build stuff on the DOM with createElement, createTextNode and appendChild -- as then what you are trying to create would already be available as a variable so you'd not have to getElementById it in the first place. Even worse, your 'displayMessage' is only run 'onsubmit' -- long, LONG after the onload you're trying to do. Worse, doing a document.write at the submit is so far after the DOM is built it will erase the entire document. Might also help if your markup didn't have it's head stuck up 1997's backside too.... with the tables for layout, long deprecated tags like FONT, attributes like bgColor that have no business on any website written the past decade and a half, etc, etc... Basically all the HTML 3.2 crap that proves EXACTLY what I've been saying about HTML 5's audience (which I'm assuming you're building towards with the idiotic 'false simplicity' of placeholder and other 5 only attributes). Were are your LABELs? Your FIELDSET? Why are XHTML and HTML style closings mixed?
Thank you very much for advice. I could solve this issue by using createElement, createTextNode and appendChild