使用javaScript进行表单验证-学习笔记二

上一篇 / 下一篇 2012-02-25 12:39:59 / 个人分类：html&&javaScript

一、表单的定义
FORM表单可以从客户端向服务器端发送数据，在服务器端，可以使用asp、jsp、servlet等程序将传递过来的数据读取出来进行处理。FORM定义基本格式是：
<FORM. ACTION="" METHOD="" NAME="" ENCTYPE="">
...
</FROM>
ACTION指定表单提交的目标URL。如果为空，则提交给此表单自身的URL
METHOD指定提交表单数据的方式。有两种：GET和POST
如果为空，则使用GET方式提交数据。
GET和POST的不同：
1、GET数据是URL的一部分，所以它会将表单数据附在URL后面发送。也就是说，浏览器的地址栏将会显示表单中的数据，并且通常情况下浏览器会将这个附加数据后的URL保存起来，可以通过浏览器历史记录来得到。所以这种方式不适合发送需要保密的数据的表单，如密码等。而POST不是URL的一部分，它不会将表单数据附在URL后面，所以不会有上述问题。
2、浏览器通常会限制URL长度，所以使用GET方式无法传送大量的数据，而POST方式不会有这种问题。所以，最好使用POST方式来传送表单数据。
二、使用JavaScript进行表单验证
使用javaScript可以在客户端对表单进行验证。假设有个登录表单，有用户名和密码。要求用户名和密码必须填写，否则不能登录。如果在服务器端来验证，实现上当然行得通，但是这种方式有一个弊端，如果用户没有输入用户名或密码，那他只有在提交到服务器端进行处理以后才可用得到错误信息，这无形中加重了服务的负担，也浪费了带宽。所以通常情况下，我们会将一部分不涉及到数据库的验证放到客户端来完成。
<body>
    <form. name="test" method="post" action="login.jsp">
    用户名：<input type="text" name="UserName"/>
    <br/>
   密码：<input type="password" name="Pwd"/>
   <br/>
   <input type="button" value="提交" nClick="JavaScript.:checkForm();">


    </form>

<Script. language="javaScript">
function checkForm()
{
   //定义一个变量，应用表单对象
   var theForm. = document.TEST;
   if(theForm.UserName.value=="")
   {
   alert("请输入用户名！");
   theForm.UserName.focus();
   }
else if(theForm.Pwd.value=="")
{
alert("请输入密码！");
theForm.Pwd.focus();
}
else
{
theForm.submit();
}
}
</Script>
</body>
</html>

收藏举报

TAG:

查看全部评论