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程序设计有所帮助。