Form表单中默认值的改变(switch、for中使用break)
2011-11-11 09:37
344 查看
最近修改一个js函数,却发现自己需要学习的还很多
函数的主要目的是想知道form表单中的值有没有被改变,原来的函数采用的是if…else/if结构,在这里,我还是把代码贴出来吧:
//函数;
function IsFormChanged(name) {
var isChanged = false;
// var form = document.getElementById(name);
var form = document.forms[name];
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
var type = element.type;
if (type == "text" || type == "hidden" || type == "textarea" || type == "button") {
if (element.value != element.defaultValue) {
isChanged = true;
alert("1");
break;
}
} else if (type == "radio" || type == "checkbox") {
if (element.checked != element.defaultChecked) {
isChanged = true;
alert("2");
break;
}
} else if (type == "select-one"|| type == "select-multiple") {
for (var j = 0; j < element.options.length; j++) {
if (element.options[j].selected != element.options[j].defaultSelected) {
isChanged = true;
alert("3");
break;
}
}
} else {
// etc...
}
}
alert( isChanged?"你改变了表单的默认值":"表单的值没有改变");
return isChanged;
}
这个函数思路很清晰了,但是,我准备采用另外一个方式来重写它,我采用的是switch,于是,一开始,我把if…else/if都改成switch,可是,发现不能验证,后来,我发现了:for循环中使用switch,然后用break的话,退出来的是switch结构,循环还要继续的,而我需要的是直接退回for循环。上网找了一些解决办法,最后发现把switch部分的分离出来单独写成一个函数比较好,但是,考虑到这个函数最终只会在一个函数中使用,就是我们的判断form表单默认值的函数,而且,由于项目开发的需要,我把一些公用的函数都封装起来,所以,最后我把函数改写成了如下的形式:
var Form={
IsFormChanged:function(id){
/*IsFormChangedCase这个函数我本来是放在外面的,和IsFormChanged的级别是一样的,但是现在只有IsFormChanged这个函数使用这个,其原因是因为switch和for中都是用break的缘故,所以,我最终把这个函数作为IsFormChanged函数的一个变量来使用。
*/
var IsFormChangedCase=function(element){
var isChanged = false;
switch(element.type){
case "text":
case "hidden":
case "textarea":
case "button":
if(element.value != element.defaultValue)
isChanged= true;
break;
case "radio":
case "checkbox":
if(element.checked != element.defaultChecked)
isChanged= true;
break;
case "select-one":
case "select-multiple":
for (var j = 0; j < element.options.length; j++){
if(element.options[j].selected != element.options[j].defaultSelected){
isChanged= true;
break;
}
}
break;
}
return isChanged;
};
var str=false;
var form = document.getElementById(id);
for (var i = 0; i < form.elements.length; i++){
var element = form.elements[i];
if(IsFormChangedCase(element)){
str=true;
break;
}
}
return str;
}
}
//这个只是测试函数
function test()
{
var ret=Form.IsFormChanged("frm2");
alert( ret?"你改变了表单的默认值":"表单的值没有改变");
return ret;
}
函数的主要目的是想知道form表单中的值有没有被改变,原来的函数采用的是if…else/if结构,在这里,我还是把代码贴出来吧:
//函数;
function IsFormChanged(name) {
var isChanged = false;
// var form = document.getElementById(name);
var form = document.forms[name];
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
var type = element.type;
if (type == "text" || type == "hidden" || type == "textarea" || type == "button") {
if (element.value != element.defaultValue) {
isChanged = true;
alert("1");
break;
}
} else if (type == "radio" || type == "checkbox") {
if (element.checked != element.defaultChecked) {
isChanged = true;
alert("2");
break;
}
} else if (type == "select-one"|| type == "select-multiple") {
for (var j = 0; j < element.options.length; j++) {
if (element.options[j].selected != element.options[j].defaultSelected) {
isChanged = true;
alert("3");
break;
}
}
} else {
// etc...
}
}
alert( isChanged?"你改变了表单的默认值":"表单的值没有改变");
return isChanged;
}
这个函数思路很清晰了,但是,我准备采用另外一个方式来重写它,我采用的是switch,于是,一开始,我把if…else/if都改成switch,可是,发现不能验证,后来,我发现了:for循环中使用switch,然后用break的话,退出来的是switch结构,循环还要继续的,而我需要的是直接退回for循环。上网找了一些解决办法,最后发现把switch部分的分离出来单独写成一个函数比较好,但是,考虑到这个函数最终只会在一个函数中使用,就是我们的判断form表单默认值的函数,而且,由于项目开发的需要,我把一些公用的函数都封装起来,所以,最后我把函数改写成了如下的形式:
var Form={
IsFormChanged:function(id){
/*IsFormChangedCase这个函数我本来是放在外面的,和IsFormChanged的级别是一样的,但是现在只有IsFormChanged这个函数使用这个,其原因是因为switch和for中都是用break的缘故,所以,我最终把这个函数作为IsFormChanged函数的一个变量来使用。
*/
var IsFormChangedCase=function(element){
var isChanged = false;
switch(element.type){
case "text":
case "hidden":
case "textarea":
case "button":
if(element.value != element.defaultValue)
isChanged= true;
break;
case "radio":
case "checkbox":
if(element.checked != element.defaultChecked)
isChanged= true;
break;
case "select-one":
case "select-multiple":
for (var j = 0; j < element.options.length; j++){
if(element.options[j].selected != element.options[j].defaultSelected){
isChanged= true;
break;
}
}
break;
}
return isChanged;
};
var str=false;
var form = document.getElementById(id);
for (var i = 0; i < form.elements.length; i++){
var element = form.elements[i];
if(IsFormChangedCase(element)){
str=true;
break;
}
}
return str;
}
}
//这个只是测试函数
function test()
{
var ret=Form.IsFormChanged("frm2");
alert( ret?"你改变了表单的默认值":"表单的值没有改变");
return ret;
}
相关文章推荐
- if,continue,break,while,do-while, switch,return,foreach,for等条件语句的使用
- 一般处理程序中使用隐藏域来实现非Form表单元素上数据的改变
- 在while()/do...while()/for()/switch()环境下,对break的使用。
- golang for switch break 使用
- switch语句和for语句中break以及continue的使用
- (14)使用Ajax 提交 Form表单
- JSP使用<form>表单无法跳转时的一种解决办法
- 使用饿了吗switch改变状态,改变图标的状态
- FORM中使用onSubmit="return false"防止表单自动提交
- 04-01 Java switch、for、while、do while语句,循环嵌套,跳转语句break、continue、return
- 实现使用HTTP协议发送multipart/form-data类型的HTTP表单
- 使用for、while 以及repeat-break实现循环语句
- ExtJs 备忘录(1)—— Form表单(一) [ 控件使用 ](2)
- Javascript:使用jQuery提交Form表单
- break continue switch 语句的使用
- html_基础之form表单提交、label 、for、table
- 四【用django2.0来开发】后台会员管理(二) ModelForm表单的使用方法以及数据验证
- Laravel中使用FormRequest进行表单验证方法及问题汇总
- 微信小程序使用form表单获取输入框数据的实例代码
- 表单包含file上传文件提交,使用ajaxSubmint或者ajaxForm 遇到的问题以及解决方法