任何可以交互的站点都会有输入表单，用户在这些表单中输入他们是谁，他们想买什么，他们住在哪里等信息。这些数据会被传递到负责后端处理的组件—Perl 的 CGI 脚本，PHP 处理引擎，诸如 Oracle 这样的数据库，或者您投资的其它技术。无论后端是什么样的系统，都不会愿意把时间浪费在一些虚假的信息上，而用户有些时候也不喜欢这样。如果用户提交给 CGI 的信息中包含错误，那么在信息通过英特网传递到服务器，在服务器上进行校验，然后向用户返回一个气人的错误信息之前，将会产生明显的延迟—一般是几秒钟。

     如果在提交表单之前，对用户的输入作一些初步的正当性检查，那就不会有等待的时间了。客户端的校验是很快速的，因为这个校验不必通过网络提交任何数据。在转向其它页面之前，JavaScript 可以捕捉到用户输入的任何错误数据。

     在服务器端再次对数据进行检查还是有必要的，因为有些时候用户会关掉浏览器对 JavaScript 的支持，有些用户也可能恶意地或者偶然地找到了绕开客户端检查的途径。对于大多数用户来说，基于 JavaScript 的表单校验，会在前端节省很多时间。

脚本的目的

     脚本和 HTML 表单相伴出现。当用户在表单上点击 Submit（提交）按键时，表单数据就会被发送给一个 JavaScript 检查函数，这个函数会对用户输入的各个方面进行检查，以确保它们具有正确的格式。程序会根据特定的条件评价每个表单元素。如果发现某个输入域上有错误，脚本就会返回一个警告，来解释字符串应该遵守什么格式。JavaScript 中具有相当强壮的字符串处理和规则表达式技术，可以处理这些检查。

checkWholeForm()

我们把主控函数命名为 checkWholeForm()，放在含有输入表单（form）的页面上方。

function checkWholeForm(theForm) {
    var why = "";
    why += checkEmail(theForm.email.value);
    why += checkPhone(theForm.phone.value);
    why += checkPassword(theForm.password.value);
    why += checkUsername(theForm.username.value);
    why += isEmpty(theForm.notempty.value);
    why += isDifferent(theForm.different.value);
    for (i=0, n=theForm.radios.length; i<n; i++) {
        if (theForm.radios[i].checked) {
            var checkvalue = theForm.radios[i].value;
            break;
        } 
    }
    why += checkRadio(checkvalue);
    why += checkDropdown(theForm.choose.selectedIndex);
    if (why != "") {
       alert(why);
       return false;
    }
return true;
}

这个函数调用了一系列子函数，每个子函数负责对表单中的某一个元素进行检查，确认其是否遵循特定的字符串格式，并返回一个错误描述信息。如果子函数返回了空字符串，就表示它对应的元素是符合格式约束的。

checkUsername()

这个函数用来检查用户是否在 username（用户名）输入域上输入了字符（我们将使用同样的函数对每个表单输入域进行空白检查）。

function checkUsername (strng) {
 var error = "";
 if (strng == "") {
    error = "You didnt enter a username.\n";
 }

我们把 username 域的值传递给该函数，该函数则把这个值和空字符串("")作比较。如果这两个值一样，我们就可以确认 username 域为空，并向主控函数返回警告信息。如果这个域不为空，我们就转向下一个“障碍”。我们只允许用户输入4到10个字符（不包含4和10）的用户名，因此需要检查该字符串的长度，并在该长度太长或者太短时拒绝输入。

if ((strng.length < 4) || (strng.length > 10)) {
    error = "The username is the wrong length.\n";
}

下一步，我们希望禁止一些特定的字符，使之不能出现在用户名字符串上。具体地说，我们只允许出现字母，数字，还有下划线。我们可以使用正则表达式和 test() 方法来进行这种检查。在 JavaScript 1.2 中提供的规则表达式函数和 Perl 的正则表达式相类似，只是在语法上作了一点简化。如果您了解 Perl，则对掌握 JavaScript 的规则表达式就不会有任何障碍。在 JavaScript 中，规则表达式/\W/是一个为了方便而预定义的标准字符集，表示“除了字母，数字，和下划线的任何字符”。因此我们把 illegalChars 变量的值设定为这个正则表达式，然后用这个变量对 username 字符串进行检测，看是否可以找到匹配的字符串，如果找到了这种字符串，我们就扔出一个警告信息。

var illegalChars = /\W/;
  // allow only letters, numbers, and underscores
    if (illegalChars.test(strng)) {
       error = "The username contains illegal characters.\n";
    } 

到此为止，我们对 username 进行三道检查。如果全部通过这三道检查，则这个输入就 OK 了。我们就把 username 的级别设定为通过，然后转向下一个输入域。

checkPassword()

对于密码输入域，我们一样希望限制其长度（这回我们使它的长度保持在6到8个字符之间），并且只允许字符和数字—这次不允许下划线了。因此我们必须使用一个新的规则表达式来定义我们禁止的字符。这个表达式和前一个表达式一样，包含\W —即除了字母，数字，和下划线之外的所有字符，但是我们需要显式说明下划线，以便把输入限制在字母和数字中。因此，我们使用：/[\W_]/。