An alternative is to simply use what HTML has built-in:

<input type="password" required minlength="8"> 

will make that input mandatory and enforce a minimum of eight characters. (You can also use these attributes with type="text".) It's no less secure than doing the validation in JavaScript, as you should still validate it server-side anyway. However, it isn't possible to check using HTML attributes that the two password fields are the same.

The :optional and :required CSS pseudo-classes can be used for styling the input based on the required attribute, but you can also use the more general :valid and :invalid pseudo-classes, which will also respond to things like minlength. You can check these pseudo-classes in JavaScript using Element#matches, but you might have to also check for non-standard naming as ${prefix}MatchesSelector.

The only problem with this approach is the browser compatibility: minlength is not supported except by Chrome and Opera, but you can replace it with the pattern attribute which has wider support, along with the required attribute. Except for Safari and IE <10.

More information about <input> is available at MDN and WebPlatform Docs.

An alternative is to simply use what HTML has built-in:

<input type="password" required minlength="8"> 

will make that input mandatory and enforce a minimum of eight characters. (You can also use these attributes with type="text".) It's no less secure than doing the validation in JavaScript, as you should still validate it server-side anyway. However, it isn't possible to check using HTML attributes that the two password fields are the same.

The :optional and :required CSS pseudo-classes can be used for styling the input based on the required attribute, but you can also use the more general :valid and :invalid pseudo-classes, which will also respond to things like minlength. You can check these pseudo-classes in JavaScript using Element#matches, but you might have to also check for non-standard naming as ${prefix}MatchesSelector.

The only problem with this approach is the browser compatibility: minlength is not supported except by Chrome and Opera, but you can replace it with the pattern attribute which has wider support, along with the required attribute. Except for Safari and IE <10.

More information about <input> is available at MDN and WebPlatform Docs.