Verify whether the user has modified the data on the page. _ javascript skills
Source: Internet
Author: User
When implementing the program modification module, check whether the user has modified the data on the page to remind the user to save the modified data in time. Cause:
When implementing the program modification module, check whether the user has modified the data on the page to remind the user to save the modified data in time.
Implementation requirements:
To determine whether the user has modified the input content, you must be able to determine the checkbox, text, radio, and so on in the input. You do not know how many inputs will be, or the input ID and name, you cannot submit the changes on the client. Both IE and firefox environments are required. You must also support the use of master and content pages.
Solution;
Solution: record all input values or States during page loading. If you are required to adjust the control status immediately during modification, in The onclick and onkeypress events on data zone p, call the function to check whether the data has changed, and set the status of the corresponding control (using ha_setch ()). If the check process is submitted or manually controlled by the user, it is called in the corresponding operation event to check whether the data changes (for example, ha_checkin () is used in the onclick () of the button () control submission ).
The following is the implementation code
Var ha_last = new Array; // defines a global empty object and stores all the initial values.
Function ha_get () // read the Initial Value
{Var ha_input = document. getElementsByTagName ("input ");
For (var I = 0; I {
If (ha_input [I]. type = "password") {ha_last.push (ha_input [I]. value) ;}// you must set the type value and object attribute on the basic page.
If (ha_input [I]. type = "radio") {ha_last.push (ha_input [I]. checked);} // ensure that the check range is accurate.
}
}
Window. onload = ha_get; // bind the function to read the initial value.
Function ha_checkin () // check whether the new input value is equal to the initial value. Returns the judgment result. True indicates that no modification has been made, and false indicates that modification has been made.
{Var ha_now = new Array;
Var ha_input = document. getElementsByTagName ("input ");
For (var I = 0; I {
If (ha_input [I]. type = "password") {ha_no1_push (ha_input [I]. value) ;}// set the type value and object attribute on the basic page.
If (ha_input [I]. type = "radio") {ha_now.push (ha_input [I]. checked);} // it must be consistent with the label checked in ha_get ().
}
If (ha_no1_tostring () = ha_last.toString () // not modified
{Return true ;}
Else // modified
{Return false ;}
}
Function ha_setch () {// sets the status of the corresponding control
If (ha_checkin () // no changes
// Changes the display and function status of the control.
Else // changed
// Changes the display and function status of the control.
}
Note: The preceding solutions are only available in IE6 and firefox3.0. 2. Not tested in other browsers.
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.