题目:
用户访问首页,用一个下拉菜单选择背景颜色,提交,到达欢迎页面,背景颜色用为用户选择的颜色。下次用户访问欢迎页面,直接显示那种颜色,无需重新选择。
解题思路:
用户设置的界面,在下次打开网页后依旧可以恢复,若是把保存的设置放到服务器端,则会占用大量的服务器资源,而且用户设置并不是什么隐私,所以可以考虑使用Cookie技术,把用户设置的界面保存到本地。
有人说可以使用数据库,可是并非每个客户端都有数据库的,所以这个思路不好。
解题过程:
首先,先写一个select的下拉菜单,代码如下:
<select name="color">
<option value="white">白色</option>
<option value="black">黑色</option>
<option value="blue">蓝色</option>
</select>
select记得加一个name属性,因为我们要获取用户设置的颜色,等一下会用到request.getParameter(String)这个方法。
第二步,写一个简单的JSP首页,代码如下
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
欢迎来到首页<br>
请选择页面的背景颜色
<form action="login2.jsp" method="post" >
<select name="color">
<option value="white">白色</option>
<option value="black">黑色</option>
<option value="blue">蓝色</option>
</select>
<input type="submit" value="提交">
</form>
</body>
</html>
可以看到,当用户选择了颜色之后,表单被发送到了login2.jsp这个页面,所以我们以login2.jsp为欢迎页面,观察用户设置的颜色是否生效了
第三步:写一个login2.jsp作为欢迎页面。
在这个页面中,最重要的是用户设置的背景颜色了,在html中,设置背景颜色的代码如下:
<style>
body{
background-color:<%=color%>;
}
</style>
在这插入了JSP的代码段,其中的color来自String color=request.getParameter(“color”);
那么如何把color保存起来,下次在用呢?
这里就是我们提到的cookie了,cookie代码如下:
<%
String color=request.getParameter("color");
if(color!=null){
Cookie cookie=new Cookie("color",color);
cookie.setMaxAge(600);
response.addCookie(cookie);
}
%>
最后一句中的response.addCookie(cookie);就已经把当前存放了color的cookie存起来了。
那下次直接运行login2.jsp的时候,jsp如何去找到这个cookie呢,代码如下:
<%
Cookie[] cookies=request.getCookies();
if(cookies!=null){
for(int i=0;i<cookies.length;i++){
if(cookies[i].getName().equals("color")){
color=cookies[i].getValue();
System.out.println(color);
break;
}
}}
%>
我在这里设置了一个条件 if(cookies!=null),因为直接运行login2.jsp的时候,
Cookie[] cookies=request.getCookies();是get不到任何cookie的,也就不用存放了。
接下来贴上完整的login2.jsp的代码:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
<%
String color=request.getParameter("color");
if(color!=null){
Cookie cookie=new Cookie("color",color);
cookie.setMaxAge(600);
response.addCookie(cookie);}
Cookie[] cookies=request.getCookies();
if(cookies!=null){
for(int i=0;i<cookies.length;i++){
if(cookies[i].getName().equals("color")){
color=cookies[i].getValue();
break;
}
}}
%>
body{
background-color:<%=color%>;
}
</style>
<title>Insert title here</title>
</head>
<body>
Welcome!成功修改背景颜色,请刷新后观看
</body>
</html>
最后如果想要测试cookie里面到底存放了什么,大家可以用打印语句在控制台进行查看。
需要一提的是,更改了颜色后,往往需要刷新,可能是因为保存的cookie并没有实时存入,浏览器获取的也许是上一次的cookie,所以建议大家更新了颜色后,刷新一下页面,这样下一次打开,就会是上次设置的颜色了。