我有一个包含五个字段的表单;first name
, last name
,和. username
_password
passwordConfirmation
我首先想说的是我不想要最复杂的方法,这是一个非常简单的网站,永远不会上线,纯粹是为了演示目的,我不担心错误捕获的意义有害的用户输入。
到目前为止,我有这个:
function validateRegistrationForm(firstName, lastName, username, password, passwordConfirmation) {
alert("validate form function has been called");
//alert("function has been called");
//---
var firstName = firstName;
//alert(firstName);
var lastName = lastName;
//alert(lastName);
var username = username;
//alert(username);
var password = password;
//alert(password);
var passwordConfirmation = passwordConfirmation;
//alert(passwordConfirmation);
//---
//**The code that I have sectioned off here, I am unsure whether I need it or not, could someone please explain to me why I would do this, and not just reference the parameters in the function directly?**
// Check here if all the fields in the registeration form have been filled.
if ( firstname == null || firstname == "" ) {
//firstname hasn't been filled out
}
if ( lastName == null || lastName == "" ) {
//lastname hasn't been filled out
}
if ( username == null || username == "" ) {
//username hasn't been filled out
}
if ( password == null || password == "" ) {
//password hasn't been filled out
}
if ( passwordConfirmation == null || passwordConfirmation == "" ) {
//passwordconfirmation hasn't been filled out
}
}
我想有一种方法来检查每个字段是否已填写(我认为我在这里填写),如果没有,则生成通知,例如相关输入元素周围的红色边框和/或消息以及如何解决问题的说明。我知道这可以用 css 完成,但我不确定最有效的方法。
目前我已经创建了这两个功能:
function generateError(messageText, elementIdentifier) {
alert("error generator called");
//var element = document.getElementById(elementID);
//var error = document.createTextNode(message);
//element.innerHTML = message;
alert("Element: " + elementIdentifier + ", Reason: " + messageText);
}
function validatePassword(password, passwordConfirmation) {
alert("password check called");
if (password == passwordConfirmation) {
if (password.length < 8) {
//password too short
//alert("password\'s match but they are too short");
return false;
} else {
//passwords match and the right length
//alert("password\'s match and they are 8 characters or longer");
return true;
}
} else {
//the two do not match
//alert("they don\'t match")
generateError("Passwords don\'t match", "password");
return false;
}
}
该validatePassword()
函数将密码和密码确认作为两个参数,我认为这已经有效,我想要将生成的错误传递给generateError()
将它们全部存储在数组中的函数,然后逐个循环显示以显示用户有什么问题。