Properties and methods of forms, getting forms and elements of forms, validating forms

Properties and methods for forms

One. The attribute of the form field (Id/name/value/form), where the Value property is used as an example
The Form property above represents the parent form object that gets the form field

1. Obtaining a property

Console.log (Document.myform.username.value);

2. Setting of properties

Document.myform.username.value= "123";

3. Get the parent form object of a form field

Console.log (Document.myform.username.form);

4. Disable the form control (this is disabled username this input control, equal to TRUE indicates disabled)

Document.myform.username.disable=true;



Two. Methods for form fields

1. When focus () is focused, execute the code in curly braces

Document.myform.username.onfocus () =function{() ...}

2. Blur () After losing focus, execute the code in curly braces

Document.myform.username.onblur () =function{() ...}


Three. Events for form fields (different from methods)

1. Focus Event

2. Blur Events

How to get Forms

How to get a single number of tables: Document.forms.length


How to get forms:

1. Document.forms[index]: Get through the index value of forms

For example: Document.forms[0]: Get a form with an index value of 0 (that is, the first form form)

2. document.forms["Name value"]: Gets the corresponding form from the value of the Name property in the form

For example: document.forms["MyForm"]: MyForm is the value of the Name property of a form

3. Document.forms. The value of the form name: Gets the corresponding form from the value of the Name property in the form

For example: Document.forms.myform:myform is the value of the Name property of a form

4. Document. The value of the form name: Gets the corresponding form from the value of the Name property in the form

For example: Document.myform:myform is the value of the Name property of a form

How to get form elements

I. Elements: A collection of form fields within a form; Note: Label labels do not belong to elements within the form

1. Get the number of elements inside the form: document.myform.elements.length



Two. Get form interior elements

Gets the property value of a form field within the corresponding form: (Note: In a form, the value values represent the text content within a form field)

Mode 1:document.myform.elements[index]. Property name
Explanation: The form is MyForm, get a form field with index value of indexes, get its property value

Mode 2:document.myform.elements["Name value"]. Property name
Explanation: The form is MyForm, get the form field that corresponds to the name value in brackets, get its property value

Way 3:document.myform.elements. Form Name value. property name
Explanation: The form is MyForm, gets the form field that is the name value in the form, gets its property value

Way 4:document.myform. Form Name value. property name (the value directly following the field name in the form)
Explanation: The form is MyForm, gets the form field that is the name value in the form, gets its property value

Examples are as follows:
Document.myform.elements[0].value: Gets the value of the Value property to the first form field

document.myform.elements["like[]"].id: Gets the value of the id attribute to the name value of the like[] field

Document.myform.elements.username.value: Gets the value of the values property to the name value of the username field

Document.myform.username.id: Gets the value of the id attribute to the name value of the username field


Three. Precautions

1. Elements this form element collection cannot be used with a radio box (type= "Radio") and can be used for other form fields
2. The checked attribute in the radio box has two values:
Document.myform.radio[0].checked = true; Indicates that it is selected

document.myform.radio[0].checked = false; Indicates that it was not selected

3. Wording in the IF statement: if (document.myform.radio[0].checked)
Indicates Document.myform.radio[0] is selected

Validating forms

Way One:
1. In the form form, set a <input type= "submit" value= "Submission", this button is used to submit the contents of this form;
2. Set a check function in the script block, such as function check (), which is used to implement the validation requirements of various controls;
3. In the form's definition, set a onsubmit= "return check ()", which is the function when the Submit button is clicked (when the program triggers the event), the program implements the checksum code in the check function, and then the address that is submitted to the form, where action= "#1" is used to set the address to which the form is submitted

The approximate procedure is as follows:
<body>
form< action= "#1" id= "MyForm" name= "MyForm" method= "POST" onsubmit= "return Check ()" >
<input type= "Submit" id= "Tijiao" name= "Tijiao" value= "Commit" >
</form>
</body>
<script>
function Check () {
Set up validation requirements
}
</script>




Way two:
1. You can set up multiple buttons by submitting the desired verification requirements by setting the button buttons;
2. Set button in the body block to add events to button buttons in the script block;
3. Two required statements in the event:
Document.myform.action= "#1"; Used to set the address to which the form was submitted
Document.myform.submit (); where the Submit () method represents the Submission form, click the button to submit the form

The procedure is as follows:
<body>
<input type= "button" id= "btn" name= "BTN" value= "submit Button" >
</body>

<script>
Document.myform.btn.onclick=function () {
Document.myform.action= "#2";
Document.myform.submit ();
}
</script>

Properties and methods for forms, getting forms and form elements, validating forms