Trouble using JavaScript events on submitting a form to validate its fields

I would like to implement a form with fields for which the validation is "real-time" using JavaScript.

In order to do that I used Java events in this way:

Text field

onkeyup: this is used to send a request that checks if there are errors for this field every time you release a key. If there are errors it will show those, otherwise an "Ok!" text.

Submit button

onclick: when clicked, this will check again if there are errors. If so, this will show errors, otherwise it will hide the submit button.

At the end of the page I have a JavaScript that will focus a Text Field when show up.

Using simultaneously onkeyup and focus events on the field, after the form is submitted WITHOUT click the button (event related to the button happens only when the button is clicked, not开发者_开发技巧 when I use the 'enter' key [on keyboard] to submit the form), the focus event will trigger automatically the onkeyup event: this means that, after submitting, are called two events (focus implies onkeyup) and so for the Text Field will be displayed first the errors, if there are, and then the "Ok!" text.

I would like to not focus on the field after submitting the form so the onkeyup event will be not triggered... or use the 'enter' key to simulate the 'click' of the submit button.

P.S.: if you know other techniques to perform validation in "real-time" (and better), let me know.

JQuery and the JQuery validation plugin will save you heaps of time in terms of implementing live validation.

You can also combine them with the JQuery Form plugin to check validation on (before, technically) submit.