php登录表单验证错误返回,使用Javascript的PHP表单验证不会在返回false时停止

我一直在尝试通过Javascript进行一个简单的HTML表单验证

我已经在这个问题上挣扎了一段时间了,举了几个例子,不管我接下来怎么做,我的索引页面在点击表单按钮后都会继续加载,我相信我已经在正确的位置放置了return false来中断其余的代码执行,有什么想法吗?”我的“代码如下

index.php索引

if (isset($_POST["register"]))

{

$user = $_POST["username"];

echo "Welcome ".$user;

}

?>

Form validation with javascript

// GETTING ALL INPUT TEXT OBJECTS

var username = document.forms["vform"]["username"];

var email = document.forms["vform"]["email"];

var password = document.forms["vform"]["password"];

var password_confirmation = document.forms["vform"]["password_confirmation"];

// GETTING ALL ERROR DISPLAY OBJECTS

var name_error = document.getElementId("name_error");

var email_error = document.getElementId("email_error");

var password_error = document.getElementId("password_error");

// SETTING ALL EVENT LISTENERS

username.addEventListener("blur", nameVerify, true);

email.addEventListener("blur", emailVerify, true);

password.addEventListener("blur", passwordVerify, true);

// Validation Function

function Validate(){

// Username Validation

if (username.value == ""){

username.style.border = "1px solid red";

name_error.textContent = "Username is required";

username.focus();

return false;

}

// Email Validation

if (email.value == ""){

email.style.border = "1px solid red";

email_error.textContent = "email is required";

email.focus();

return false;

}

// Password Validation

if (password.value == ""){

password.style.border = "1px solid red";

password_error.textContent = "password is required";

password.focus();

return false;

}

// check if the two passwords match

if (password.value != password_confirmation.value)

{

pasword.style.border = "1px solid red";

pasword_confirmation.style.border = "1px solid red";

password_error.innerHTML = "The two passwords dont match";

return false;

}

}

// event handler functions

function nameVerify(){

if (username.value != "")

{

username.style.border = "1px solid #5E6E66";

name_error.innerHTML = "";

return true;

}

}

function emailVerify(){

if (email.value != "")

{

email.style.border = "1px solid #5E6E66";

email_error.innerHTML = "";

return true;

}

}

function passwordVerify(){

if (passwprd.value != "")

{

passwprd.style.border = "1px solid #5E6E66";

passwprd_error.innerHTML = "";

return true;

}

}

#wrapper{

width: 35%;

margin: 50px auto;

padding: 20px;

background: #EFFFE0;

}

form{

width: 50%;

margin: 100px auto;

}

form div{

margin: 3px auto;

}

.textInput{

margin-top: 2px;

height: 28px;

border: 1px solid #5E6E66;

font-size: 16px;

padding: 1px;

width: 100%;

}

.btn{

padding: 7px;

width: 100%;

}

.val_error{

color: #FF1F1F;

}

多谢您的帮助!