I wrote a simple log in page. I want to use a javascript event listener for the submit button. My goal in this is to improve my javascript writing with making it most efficient and clean by using an object. I chose an singleton object function since there will only be one instance of this ever. This is what I have and I was wondering a better way to write the javascript portion. I only inlcuded the html portion to give an idea of is going on:
<head>
<link rel="stylesheet" href="css/login_main.css"></link>
</head>
<body>
<form action="index.php" method="post">
<div id="enter">Enter Username :<span class="blinkme">>_</span><input class="inputs" type="text" name="uname" maxlength="20" autofocus="autofocus"/></div>
<div id="enter">Enter Password :<span class="blinkme">>_</span><input class="inputs" type="password" name="pword" maxlength="20"/></div>
<div id="done"><a href="">[< Submit >]</a></div>
</form>
</body>
<script style="text/javascript" src="js/login_main.js"></script>
</html>
localhost js # cat login_main.js
var formStuff = function () {
var variables = {
done : document.getElementById("done"),
}
function getSubmit () {
docuement.forms[0].submit();
}
return {
submitForm: getSubmit,
done: function () { return variables.done; },
}
}();
window.onload = formStuff.done.addEventListener("click", formStuff.getSubmit, false);
Simply put:
Or (but then you should remove the <a …>):