I've got a simple page with a text field and a button. When you
type in the name of a color, and press the button, the page's background changes to that color. I've got it set up so that you can also press Tab.
But if you press Enter, the background changes, and then the page reloads.
How can I cause the page to not reload?
Here are the javascript functions in the page's head:
function setColor(color) {
document.bgColor=color;
}
function maybeSetColor(color, e) {
var charCode = (navigator.appName == "Netscape") ? e.which : e.keyCode;
if (charCode == 13) {
setColor(color);
}
return false;
}
And here are the form elements. They're in a table, to make them align nicely:
‹table border="0" width="20%" align="center" cellspacing="0" cellpadding="0"›
‹tr›
‹td align="center"›
‹input type="text" name="colorField"
onBlur="setColor(document.forms[0].colorField.value)"
onKeyPress="maybeSetColor(document.forms[0].colorField.value, event)"›
‹/td›
‹/tr›
‹tr›
‹td align="center"›
‹input type="button" name="setColorButton" value="Set background"
onClick="setColor(document.forms[0].colorField.value)"›
‹/td›
‹/tr›
‹/table›
type in the name of a color, and press the button, the page's background changes to that color. I've got it set up so that you can also press Tab.
But if you press Enter, the background changes, and then the page reloads.
How can I cause the page to not reload?
Here are the javascript functions in the page's head:
function setColor(color) {
document.bgColor=color;
}
function maybeSetColor(color, e) {
var charCode = (navigator.appName == "Netscape") ? e.which : e.keyCode;
if (charCode == 13) {
setColor(color);
}
return false;
}
And here are the form elements. They're in a table, to make them align nicely:
‹table border="0" width="20%" align="center" cellspacing="0" cellpadding="0"›
‹tr›
‹td align="center"›
‹input type="text" name="colorField"
onBlur="setColor(document.forms[0].colorField.value)"
onKeyPress="maybeSetColor(document.forms[0].colorField.value, event)"›
‹/td›
‹/tr›
‹tr›
‹td align="center"›
‹input type="button" name="setColorButton" value="Set background"
onClick="setColor(document.forms[0].colorField.value)"›
‹/td›
‹/tr›
‹/table›