如何使编码简单请求表单验证

How to make Coding Simple Request Form Validation

不得不从头开始制作申请表,并且对我需要什么才能让它发挥作用有点困惑。这是我必须使用的 HTML,javacode 是我从头开始组合的,它在 .js 文件的第 18 行说 unexpected token } 但我需要 } 来完成功能。

HTML

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Chapter 10: Registration Form</title>
</head>
<body>
<div class="page">
    <table>
        <tr>
            <td><input type="text" name="txtName" id="txtName" placeholder="Name" /></td>
            <td><p class="error" id="txtNameError">Name must be at least 6 characters long.</p></td>
        </tr>
        <tr>
            <td><input type="text" name="txtPhone" id="txtPhone" placeholder="Phone: ###-###-####" /></td>
            <td><p class="error" id="txtPhoneError">Phone must be in the format ###-###-####.</p></td>
        </tr>
        <tr>
            <td><input type="text" name="txtEmail" id="txtEmail" placeholder="Email Address" /></td>
            <td><p class="error" id="txtEmailError">Must be a valid email address.</p></td>
        </tr>
        <tr>
            <td colspan="2" style="text-align:center;"><button id="btnRegister" name="btnRegister">Register</button></td>
        </tr>
    </table>
</div>
<link type="text/css" rel="stylesheet" href="Chapter10.css" />
<script type="text/javascript" src="Chapter10.js"></script>
</body>
</html>

这是我到目前为止必须编写的代码,

function validateForm(){
var nameTxt = document.getElementById('txtName');
var phoneTxt = document.getElementById('txtPhone');
var emailTxt = document.getElementById('txtEmail');
{
if(allLetter(nameTxt))
{
if(ValidateEmail(txtEmail))
{
if(validatePhone(txtPhone))
}
}
return false;
console.log()
}
}
function allLetter(nameTxt) {

var letters = /^[A-Za-z]+$/;  
if(nameTxt.value.match(letters))
{  
return true;  
}   
else  
{  
alert('Username must have alphabet characters only');  
nameTxt.focus();  
return false;  
}  
} 

function phoneNumber(txtPhone){
var phoneTxt = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
if (txtPhone.value.match(phoneTxt))
{
    return ture;
}
else {
    alert("Eneter Vaild Phone Number");
    return false;
}
}

function ValidateEmail(txtEmail){   

if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*  (\.\w{2,3})+$/.test(myForm.emailAddr.value))  
{  
return (true)  
}  
alert("You have entered an invalid email address!")  
return (false)  
}  


function init(){
var btnRegister = document.getElementById('btnRegister');
btnRegister.onclick = btnRegister;
}
window.onload = init;

还需要添加什么才能让它发挥作用?我完全没有想法谢谢你的观看!

  1. 由于您的代码未格式化,您在方法的括号中丢失了 validateForm()

对此更新:

function validateForm(){
    var nameTxt = document.getElementById('txtName');
    var phoneTxt = document.getElementById('txtPhone');
    var emailTxt = document.getElementById('txtEmail');

    if(allLetter(nameTxt))
    {
        if(ValidateEmail(txtEmail))
        {
            if(validatePhone(txtPhone))
            {
            }
        }
    }
  console.log();
  return false;
}
  1. 更新此方法。

这个

function init(){
    var btnRegister = document.getElementById('btnRegister');
  btnRegister.onclick = btnRegister;
}

至此

function init(){
    var btnReg = document.getElementById('btnRegister');
    btnReg.onclick = BtnRegister;
}

3。创建方法

function BtnRegister()
{
    alert("here i am.");
}

4。更新

这个

window.onload = init;

至此

window.onload = init();
  1. 我评论这个 <script type="text/javascript" src="Chapter10.js"></script> 因为我看不到它包含什么。