JavaScript判断用户是否对表单进行了修改的方法
本文实例讲述了JavaScript判断用户是否对表单进行了修改的方法。分享给大家供大家参考。具体分析如下:
这段JS代码可以判断出用户是否对表单内容进行了修改,如果修改了表单,并退出浏览器,则会提醒用户是否要保存表单的内容,是非常有用的代码。
functionformIsDirty(form){
for(vari=0;i<form.elements.length;i++){
varelement=form.elements[i];
vartype=element.type;
if(type=="checkbox"||type=="radio"){
if(element.checked!=element.defaultChecked){
returntrue;
}
}
elseif(type=="hidden"||type=="password"||
type=="text"||type=="textarea"){
if(element.value!=element.defaultValue){
returntrue;
}
}
elseif(type=="select-one"||type=="select-multiple"){
for(varj=0;j<element.options.length;j++){
if(element.options[j].selected!=
element.options[j].defaultSelected){
returntrue;
}
}
}
}
returnfalse;
}
使用示例:当退出浏览器是,如果用户修改了表单,则提醒用户是否要保存
window.onbeforeunload=function(e){
e=e||window.event;
if(formIsDirty(document.forms["someForm"])){
//ForIEandFirefox
if(e){
e.returnValue="Youhaveunsavedchanges.";
}
//ForSafari
return"Youhaveunsavedchanges.";
}
};
下面是一个完整的范例代码
Clickonbelowbutton.Nowchangesomevaluesinformandclickthebuttonagain.
<formname="fooForm">
<inputtype="text"name="t"><br>
<inputtype="text"name="2"value="default"><br>
<selectname="some">
<optionvalue="fooo"selected="">foo</option>
<optionvalue="bar">bar</option>
</select><br>
</form>
<buttononclick="alert(formIsDirty(document.fooForm))">ClicktocheckifFormisDirty</button>
<br>
<script>
functionformIsDirty(form){
for(vari=0;i<form.elements.length;i++){
varelement=form.elements[i];
vartype=element.type;
if(type=="checkbox"||type=="radio"){
if(element.checked!=element.defaultChecked){
returntrue;
}
}
elseif(type=="hidden"||type=="password"||
type=="text"||type=="textarea"){
if(element.value!=element.defaultValue){
returntrue;
}
}
elseif(type=="select-one"||type=="select-multiple"){
for(varj=0;j<element.options.length;j++){
if(element.options[j].selected!=
element.options[j].defaultSelected){
returntrue;
}
}
}
}
returnfalse;
}
</script>
希望本文所述对大家的javascript程序设计有所帮助。