JSP3——登陆界面的构建

服务器端和客户端验证:

<%@ page contentType="text/html;charset=GBK"%>
<html><!--服务器端的验证 -->
  <head>
    <title>Local</title>
  </head>
  <body>
    <form action="local.jsp" method="post">
        用户名<input type="text" name="uid"><br/>
        密码<input type="password" name="pwd"><br/>
       <input type="submit" value="提交">
    </form> 
    <%       
      String uid=request.getParameter("uid");
      String pwd=request.getParameter("pwd");
      
      if(uid!=null&&uid.length()!=0&&
         pwd!=null&&pwd.length()!=0)
      {
           if(uid.equals("wyf")&&pwd.equals("1234"))
           {
               out.println("登录成功!");
           }
           else
           {
              out.println("非法的用户名和密码!");
           }
      }
      else
      {
           out.println("非法的用户名和密码!");
      }
     %>
  </body>
</html>
---------------------------------------------
<%@ page contentType="text/html;charset=GBK"%>
<html><!--服务器端的验证的基础上添加本地(客户端)验证,当输入为空时直接提示 -->
  <head>
    <title>Local</title>
    <script>
      function check()
      {
          if(document.all.uid.value==""
             || document.all.pwd.value=="")
          {
              alert("请输入用户名和密码!");
              return false;
          }
          return true;
      }
    </script>
  </head>
  <body>
    <form action="locala.jsp" method="post" onsubmit="return check();"><!--提交时运行check()函数-->
        用户名<input type="text" name="uid" id="uid"><br/><!--需要用JavaScript对控件进行编程的的要加id ,需要用参数的添加name -->
        密码<input type="password" name="pwd" id="pwd"><br/>
       <input type="submit" value="提交">
    </form> 
    <%       
      
      String uid=request.getParameter("uid");
      String pwd=request.getParameter("pwd");
      System.out.println(uid+"|"+pwd);
      if(uid!=null&&uid.length()!=0&&
         pwd!=null&&pwd.length()!=0)
      {
           if(uid.equals("wyf")&&pwd.equals("1234"))
           {
               out.println("登录成功!");
           }
           else
           {
              out.println("非法的用户名和密码!");
           }
      }
      else
      {
           out.println("非法的用户名和密码!");
      }
     %>
  </body>
</html>

图片按钮的设置:

 <form action="localButton.jsp" method="post" id="mf">
        用户名<input type="text" name="uid" id="uid"><br/>
        密码<input type="password" name="pwd" id="pwd"><br/>
       <img src="button.png" onclick="check()">
    </form> 

session对象:

web服务器给每一个客户端分配的一个存储空间


<%@ page 
  contentType="text/html;charset=GBK"
  import="java.util.*"//要使用集合框架
%>
<html>
  <head>
    <title>Local</title>
    <%! //成员方法
       public String getName(int id)
       {
          switch(id)
          {
             case 0:
              return "苹果";
             case 1:
              return "香蕉";
             case 2:
              return "桃子";
             case 3:
              return "梨";
          }
          return null;
       }    
    %>
  </head>
  <body>
    请选择水果
    <form action="session.jsp" method="post"><!--选项表单-->
       <select name="fruit" size="6">
         <option value="0">苹果</option>
         <option value="1">香蕉</option>
         <option value="2">桃子</option>
         <option value="3">梨</option>
       </select>
       <input type="submit" value="提交">
    </form> 
    <% 
        Map<Integer,Integer> cart=(Map<Integer,Integer>)session.getAttribute("cart");//先从session中获取值,返回object,要类型转化成水果的编号和数量
        if(cart==null)//若购物车为空
        {
           cart=new HashMap<Integer,Integer>();//创建map
           session.setAttribute("cart",cart);//将购物车对象以cart的名称放入session中
        }
        String fid=request.getParameter("fruit");//之后购物车不为或本就不为空,获取水果参数
        
        if(fid!=null&&fid.length()!=0)//已选取水果
        {
           int ffid=Integer.parseInt(fid);//将水果代号转成真正的数字
        
	        if(cart.containsKey(ffid))//如果购物车其中含有该水果
	        {
	           cart.put(ffid,cart.get(ffid)+1);
	        }
	        else//不含有则创建
	        {
	           cart.put(ffid,1);
	        }
        }
    %>
    <% 
        if(cart.size()==0)//以下是动态的表格显示购物车中的内容
        {
           out.println("对不起,购物车中没有商品!");
        }
        else
        {
    %>
        <table border="1" width="50%">
          <tr>
            <td>水果编号</td>
            <td>水果名称</td>
            <td>水果数量</td>
          </tr>
    <%
         Set<Integer> ks=cart.keySet();
         for(Integer i:ks)
         {
    %>
         <tr>
           <td><%= i %></td>
           <td><%= getName(i) %></td>
           <td><%= cart.get(i) %></td>
         </tr>
    <%        
         }
    %>
        </table>
    <%
        }
    %>
    
  </body>
</html>

cookie的使用:

作用:浏览器本身将信息持久性的保留下来,以供以后的使用。
注意:cookie的存储是不安全的,可能会被其他网页读取或覆盖掉;不是所有的浏览器都是打开cookie,要考虑cookie写入不成功的情况。

<%@ page contentType="text/html;charset=GBK" %>
<%
request.setCharacterEncoding("GBK");
String pName = request.getParameter("Name");
String pHobby = request.getParameter("Hobby");

//得到所有的Cookie
Cookie cookies[] = request.getCookies();

//若pName有有效的表单提交
if(pName!=null&&pName.length()!=0) 
{
   //创建名称为Name的cookie属性对象
   Cookie c = new Cookie("Name", pName);
   //Cookie的有效期为30秒
   c.setMaxAge(30);       
   //向浏览器写入Cookie
   response.addCookie(c);
}
//若pName未提交且Cookies不为空
else if(cookies != null) 
{  
   //遍历所有的Cookie
   for(int i=0; i<cookies.length; i++) 
   {
       //将名称为Name的Cookie属性取出存到pName中
       if(cookies[i].getName().equals("Name"))
       {
           pName = cookies[i].getValue();
       }			
   }
}

//若pHobby有有效的表单提交
if(pHobby!=null&&pHobby.length()!=0) 
{
   //创建名称为Hobby的cookie属性对象
   Cookie c = new Cookie("Hobby", pHobby);
   //Cookie的有效期为30秒
   c.setMaxAge(30);      
   //向浏览器写入Cookie
   response.addCookie(c);
}
//若pHobby未提交且Cookies不为空
else if(cookies != null)  
{  
   //遍历所有的Cookie
   for(int i=0; i<cookies.length; i++) 
   {
       //将名称为Hobby的Cookie属性取出存到pHobby中
       if(cookies[i].getName().equals("Hobby"))
       {
           pHobby = cookies[i].getValue();
       }			
   }
}
%>
<html>
    <head>
        <title>测试cookie</title>
    </head>
    <body bgcolor="#FFFFFF">
    <h2 align="center">利用 Cookies 对象把数据记录在浏览器</h2>
    <hr>
    <form action="cookie.jsp" method="POST">
        姓名<input type="text" size="20" name="Name"    
           value="<% if(pName != null) out.print(pName); %>"><br/>
        兴趣<input type="text" size="20" name="Hobby"    
          value="<% if(pHobby != null) out.print(pHobby); %>"><br/>
        <input type="submit" value="确定">
    </form>
</body>
</html>

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值