This time I will bring you JavaScriptHow to use ajax to operate the form, what are the precautions for using ajax to operate the form with JavaScript, the following is a practical case, let's take a look.
Using JavaScript to operate forms is similar to operating DOM, because the form itself is also a DOM tree.
However, the input box, drop-down box, etc. of the form can receive user input, so using JavaScript to operate the form can obtain the content entered by the user, or set new content for an input box.
The input controls of HTML form mainly include the following types:
Text box , the corresponding is used to enter text;
Password box, the corresponding is used to Enter the password;
The radio button, corresponding , is used to select one item;
Check box, corresponding , used to select multiple items;
Drop-down box, corresponding < ;select>, used to select an item;
Hidden text, corresponding , is not visible to the user, but will be hidden when the form is submitted Text is sent to the server.
##Get the value
If we get a reference to an node, we can call value directly Get the corresponding user input value:// <input type="text" id="email"> var input = document.getElementById('email'); input.value; // '用户输入的值'
// <label><input type="radio" name="weekday" id="monday" value="1"> Monday</label> // <label><input type="radio" name="weekday" id="tuesday" value="2"> Tuesday</label> var mon = document.getElementById('monday'); var tue = document.getElementById('tuesday'); mon.value; // '1' tue.value; // '2' mon.checked; // true或者false tue.checked; // true或者false
Set the value
Setting the value is similar to getting the value. For text, password, hidden and select, just set the value directly:// <input type="text" id="email"> var input = document.getElementById('email'); input.value = 'test@example.com'; // 文本框的内容已更新
HTML5 controls
HTML5 has added a large number of standard controls, commonly used ones include date, datetime, datetime-local, color, etc., they all Use the tag:<input type="date" value="2015-07-01"> <input type="datetime-local" value="2015-07-01T02:03:04"> <input type="color" value="#ff0000">
Submit the form
Finally, JavaScript can handle form submission in two ways (the AJAX method will be introduced later). Method one is to submit a form through the submit() method of the