您的位置:首页 > Web前端 > JavaScript

一个简单的用javascript验证表单的例子

2008-02-18 14:15 666 查看
in form_utils.js


// A utility function that returns true if a string contains only


// whitespace characters.


function isblank(s)




...{




for(var i = 0; i < s.length; i++) ...{


var c = s.charAt(i);


if ((c != ' ') && (c != ' ') && (c != ' ')) return false;


}


return true;


}




// This is the function that performs form verification. It will be invoked


// from the onSubmit() event handler. The handler should return whatever


// value this function returns.


function verify(f)




...{


var msg;


var empty_fields = "";


var errors = "";




// Loop through the elements of the form, looking for all


// text and textarea elements that don't have an "optional" property


// defined. Then, check for fields that are empty and make a list of them.


// Also, if any of these elements have a "min" or a "max" property defined,


// then verify that they are numbers and that they are in the right range.


// Put together error messages for fields that are wrong.




for(var i = 0; i < f.length; i++) ...{


var e = f.elements[i];




if (((e.type == "text") || (e.type == "textarea") || (e.type == "password")) && !e.optional) ...{


// first check if the field is empty




if ((e.value == null) || (e.value == "") || isblank(e.value)) ...{


empty_fields += " " + e.name;


continue;


}




// Now check for fields that are supposed to be numeric.




if (e.numeric || (e.min != null) || (e.max != null)) ...{


var v = parseFloat(e.value);


if (isNaN(v) ||


((e.min != null) && (v < e.min)) ||




((e.max != null) && (v > e.max))) ...{


errors += "- The field " + e.name + " must be a number";


if (e.min != null)


errors += " that is greater than " + e.min;


if (e.max != null && e.min != null)


errors += " and less than " + e.max;


else if (e.max != null)


errors += " that is less than " + e.max;


errors += ". ";


}


}


}


}


// Now, if there were any errors, display the messages, and


// return false to prevent the form from being submitted.


// Otherwise return true.




if (!empty_fields && !errors) ...{


return true;


}




msg = "______________________________________________________ "


msg += "The form was not submitted because of the following error(s). ";


msg += "Please correct these error(s) and re-submit. ";


msg += "______________________________________________________ "






if (empty_fields) ...{


msg += "- The following required field(s) are empty:"


+ empty_fields + " ";


if (errors) msg += " ";


}


msg += errors;


alert(msg);


return false;


}


//-->

使用时的调用方法


<script src="./form_utils.js"></script>


<script language=JAVASCRIPT type=text/javascript>




<!--


function verifyForm(f)




...{


// alert("Verifying form...");




if (verify(document.forms[0]) == true) ...{


document.getElementById('key_alpha').value =


document.getElementById('username').value;


document.getElementById('resolvname_value').value = "key.alpha:" +


document.getElementById('dm.key.alpha').value;


return true;




} else ...{


return false;


}


}


//-->




</script>


</p>


<form name=RegisterUser onSubmit="return verifyForm(this);"


action="/prs" method=post>


......


</form>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: