如果您不使用 jQuery,那么我只需编写一个验证方法,您可以在提交表单时触发该方法。该方法可以验证文本字段以确保它们不是空的或默认值。该方法将返回一个布尔值,如果它为 false,您可以触发警报并分配类以突出显示未通过验证的字段。
HTML:
<form name="form1" method="" action="" onsubmit="return validateForm(this)">
<input type="text" name="name" value="Name"/><br />
<input type="text" name="addressLine01" value="Address Line 1"/><br />
<input type="submit"/>
</form>
JavaScript:
function validateForm(form) {
var nameField = form.name;
var addressLine01 = form.addressLine01;
if (isNotEmpty(nameField)) {
if(isNotEmpty(addressLine01)) {
return true;
{
{
return false;
}
function isNotEmpty(field) {
var fieldData = field.value;
if (fieldData.length == 0 || fieldData == "" || fieldData == fieldData) {
field.className = "FieldError"; //Classs to highlight error
alert("Please correct the errors in order to continue.");
return false;
} else {
field.className = "FieldOk"; //Resets field back to default
return true; //Submits form
}
}
validateForm 方法分配您要验证的元素,然后在这种情况下调用 isNotEmpty 方法来验证该字段是否为空或未更改默认值。它不断调用 inNotEmpty 方法,直到它返回一个值 true 或者如果该字段的条件失败,它将返回 false。
试一试,让我知道它是否有帮助或您有任何问题。当然,您可以编写额外的自定义方法来仅验证数字、电子邮件地址、有效 URL 等。
如果您完全使用 jQuery,我会考虑试用 jQuery Validation 插件。我在最近的几个项目中一直在使用它,它非常好。有机会就去看看。http://docs.jquery.com/Plugins/Validation