Home > Web Front-end > JS Tutorial > body text

Javascript forms and validation-non-null validation_javascript skills

WBOY
Release: 2016-05-16 15:10:15
Original
1374 people have browsed it

Recommended reading: Javascript form validation length

Javascript form validation-submit form

Javascript form validation - first introduction to regular expressions

Javascript form validation - unveiling regular expressions

JavaScript can be used to validate input data in HTML forms before the data is sent to the server.

Check the legality of the data before submitting the form

When you want to verify the data in the form, you can use getElementById() to access any element on the web page

Each form field has a form object that can be passed to any function that validates form data

<input id="zipcode" name="zipcode" type="text" size="5" onclick="showIt(this.form)"/>
function showIt(thisForm)
{
alert(thisForm["zipcode"].value);
//通过form对象的name属性,取得元素的值
}
Copy after login

You can use the name attribute or getElementById() method to obtain the element

The timing of checking form data depends on choosing the correct user input event to handle.

In other words, the data is verified immediately after the user enters the data.

The order in which users enter data is:

Select input field

Enter data in the field

Leave this area and move to the next target

Select next target domain

Enter data in the field

In this process, a series of events will be triggered. Using these events, you can find the opportunity to verify the data

1) When the input field is selected – the onfocus event (focus) is fired

2) When leaving the input field – fire onblur event (leaving focus)

3) When you leave the domain and the input content changes – fire the onchange event

The most correct choice is to verify the data when the onblur event is fired

The first step of verification: check that the domain is not empty

<input id="phone" name="phone" type="text" size="12" onblur="validateNonEmpty(this)"/>
Copy after login

Call validateNonEmpty to respond to the onblur event

The form object is passed to the function using the keyword this

The following is the verification function

function validateNonEmpty(inputField)
{
if(inputField.value.length==0)
{
alert("Please enter a value.");
return false;
} 
return true;
}
Copy after login

When submitting a web form, the data entered by the user must be verified

When you want to verify the data in the form, you can use getElementById() to access any element on the web page

The above content is the complete description of Javascript form and verification-non-empty verification. I hope it will be helpful to everyone!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template