Need help explaining a piece of code

Bobb4 · 02-06-2012, 03:06 PM

Hi, below is some code I've found at w3schools site. It demonstrates the use of "onkeypress" event by allowing only non-numerical input. It works great and is mostly clear to me, except for the part I marked in red. Could someone please explain this part to me step by step? It's probably a noobish question, but I thought you could only use "return" inside a function. Are "return true" and "return false" just optional parameters to the "onkeypress" event? If so, where else can they be used? Also what information exactly does the "(event)" being passed into the function "noNumbers()" carry?

<html>
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum;
var keychar;
var numcheck;

if(window.event) // IE8 and earlier
{
keynum = e.keyCode;
}
else if(e.which) // IE9/Firefox/Chrome/Opera/Safari
{
keynum = e.which;
}
keychar = String.fromCharCode(keynum);
numcheck = /\d/;
return !numcheck.test(keychar);
}
</script>

<form>
Type some text (numbers not allowed):
<input type="text" onkeypress="return noNumbers(event)" /></form>

Dormilich · 02-06-2012, 03:33 PM

that is the oldest way of defining events (it dates back to pre-DOM times, hence sometimes called DOM-0 events). the return value (and therefore you need an explicit return statement) of an event attribute determines, whether the default action (in this case inserting a character) is executed or not.

the same code for DOM event handling (without taking pre IE9 into consideration)

PHP Code:


			
<input type="text" id="some_field">

Code:

function checkInput(evt)
{
    if (!(/\d/.test(evt.which))) {
        evt.preventDefault();
    }
}
document.getElementById("some_field", checkInput, true);

Philip M · 02-06-2012, 03:38 PM

I don't really see your problem, but you can test it with an alert, so:-

Code:

numcheck = /\d/;
var x = !numcheck.test(keychar);
alert (x);
return x;
}

The return statement specifies the value to be returned by a function or event handler and performs the act of returning that value to where the function was called from.

The value returned is either true or false, depending on the evaluation of the regular expression numcheck = /\d/; and then !numcheck.test(keychar); This could have been simplified to var x = (!/\d/.test(keychar)); Meaning - test the value of keychar for the presence of a digit (true or false) - and reverse the result false/true. If the result is false (a number was found) then the normal action of the keypress is suppressed or cancelled.

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

Bobb4 · 02-06-2012, 03:44 PM

Thank you, that was very helpful!