搜索框回写乱码是什么原因?

当搜索输入“白色”之后,搜索出“白色”的商品,此时搜索框里的中文“白色”正常显示,但然后点击下一页后搜索框的回写乱码是什么原因?
这是我的ListServlet.java代码:
package com.yuan.shop.action;
import com.yuan.shop.bean.Article;
import com.yuan.shop.bean.ArticleType;
import com.yuan.shop.bean.Pager;
import com.yuan.shop.service.ShopService;
import org.springframework.util.StringUtils;
import org.springframework.web.context.WebApplicationContext;
import org.springframework.web.context.support.WebApplicationContextUtils;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;
@WebServlet("/list")
public class ListServlet extends HttpServlet {
/*
注意这里不能使用注解的形式(如@Autowired、@Resource)对业务层对象进行注入,
因为Servlet本身对象是没有交给Spring容器对象管理的
*/
// @Resource
private ShopService shopService = null;//定义业务层对象
private HttpServletRequest request;
private HttpServletResponse response;
//在Servlet启用之前会调用这个方法
@Override
public void init() throws ServletException {
super.init();
//在这个方法中获取Spring容器,然后从容器中得到业务层对象
ServletContext servletContext=this.getServletContext();//首先获得ServletContext上下文对象
//获取一个Web目录的上下文对象,这其实就是一个Spring容器对象
WebApplicationContext webApplicationContext=WebApplicationContextUtils.getWebApplicationContext(servletContext);
//通过Spring容器得到这个bean(对象),即这个业务层对象
shopService= (ShopService) webApplicationContext.getBean("shopService");
}
@Override
protected void service(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
try{
this.request=req;
this.response=res;
//再获取元素内容之前先设置编码格式
request.setCharacterEncoding("UTF-8");
//response.setCharacterEncoding("UTF-8");
String method=request.getParameter("method");
switch (method){
case "getAll":
getAll();//当获取的方式是“getAll”,则调用getAll()方法
break;
}
}catch (Exception e)
{
e.printStackTrace();
}
}
private void getAll() throws ServletException, IOException {
Pager pager=new Pager();//实例化一个分页数据对象
//获取当前页码
String pageIndex=request.getParameter("pageIndex");
if (!StringUtils.isEmpty(pageIndex))//如果获取的当前页码不为空
{
pager.setCurrentPageNum(Integer.parseInt(pageIndex));
}
//获取二级类型参数
String secondType=request.getParameter("secondType");
//获取搜索框中输入的标题
String title=request.getParameter("title");
//把用户点击的二级类型也传过去,以实现下拉框的二级类型的选中显示
request.setAttribute("secondType",secondType);
//把用户输入在搜索框中的标题回传回去
request.setAttribute("title",title);
//获取一级类型参数
String typeCode=request.getParameter("typeCode");
if (!StringUtils.isEmpty(typeCode))//如果所获取的商品类型号不为空
{
//根据商品的一级类型获取商品的二级类型(二级类型编号是一级类型编号的长度加4)
List<ArticleType> secondArticleTypes=shopService.loadSecondArticleTypes(typeCode,typeCode.length()+4);
request.setAttribute("typeCode",typeCode);//注意:把一级类型也传过去,因为二级类型查询需要根据一级类型(否则会出错)
request.setAttribute("secondTypes",secondArticleTypes);
}
//查询商品的一级类型信息
List<ArticleType> firstArticleTypes= shopService.loadFirstArticleTypes();
//查询所有商品
List<Article> articles=shopService.SearchArticles(typeCode,secondType,title,pager);
request.setAttribute("firstArticleTypes",firstArticleTypes);
request.setAttribute("pager",pager);//把分页数据对象传过去
request.setAttribute("articles",articles);
request.getRequestDispatcher("/WEB-INF/jsp/list.jsp").forward(request,response);
}
}list.jsp代码
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>商品首页</title>
<!-- Bootstrap core CSS -->
<%-- c:url 标签的作用:
1.自动在URL的前面加上context path
2.如果客户端禁用了Cookie,自动使用URL重写技术,把jsessionid放到url的分号后面
/taobao/resources/bootstrap/css/bootstrap.css;jsessionid=xxxxx
--%>
<link href="<c:url value="/resources/bootstrap/css/bootstrap.css"/>" rel="stylesheet" />
<link href="${pageContext.request.contextPath }/resources/css/taobao.css" rel="stylesheet" />
<script type="text/javascript" src="${pageContext.request.contextPath }/resources/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
<!-- 横幅导航条开始 -->
<nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand " style="color: red" href="<c:url value="/list?method=getAll"/>">电商系统,卖家系统-商品管理</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="<c:url value="/logout"/>">退出</a></li>
</ul>
</div>
</div>
</nav>
<!-- 横幅导航条结束 -->
<!-- 横幅下方的主体开始 -->
<div class="container">
<div class="row row-offcanvas row-offcanvas-right">
<!-- 侧边导航开始
一级类型的
-->
<div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation">
<div class="list-group">
<c:forEach items="${requestScope.firstArticleTypes }" var="type">
<a href="<c:url value="/list?method=getAll&typeCode=${type.code }"/>" class="list-group-item <c:if test="${type.code eq param.typeCode or top.code eq fn:substring(param.typeCode, 0, 4) }">active</c:if>">${type.name }</a>
</c:forEach>
</div>
</div>
<!-- 侧边导航结束 -->
<!-- 内容主体开始 -->
<div class="col-xs-12 col-sm-9">
<p class="pull-right visible-xs">
<button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">显示导航条</button>
</p>
<div class="alert alert-info" role="alert">
<div>
<form action="<c:url value="/list?method=getAll"/>" method="post">
<table class="table-condensed">
<tbody>
<tr>
<td>
<select class="btn btn-default" placeholder="类型" id="secondType"
name="secondType">
<option value="">==请选择类型==</option>
<c:forEach items="${requestScope.secondTypes }" var="t">
<option value="${t.code}">${t.name}</option>
</c:forEach>
</select>
</td>
<td>
<!-- 如果当前选择了商品的类型,仅在该类型下面进行搜索 -->
<input type="hidden" name="typeCode" value="${typeCode}" />
<div class="input-group">
<input type="text" name="title" value="${title}"
class="form-control" placeholder="搜索商品的标题" />
<div class="input-group-btn">
<button class="btn" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
</td>
<td>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="添加商品">添加商品</button>
<span style="color: red;">${tip}</span>
</td>
</tr>
</tbody>
</table>
</form>
</div>
</div>
<!-- 展示商品数据 -->
<div class="row">
<c:forEach items="${articles }" var="a">
<div class="col-xs-6 col-lg-4">
<span class="thumbnail">
<a class="label label-danger" href="<c:url value="/list?method=deleteById&id=${a.id }&typeCode=${typeCode}&secondType=${secondType}&title=${title}"/>">删除</a>
<a class="label label-success" href="<c:url value="/list?method=showUpdate&id=${a.id }&typeCode=${typeCode}&secondType=${secondType}&title=${title}"/>">修改</a>
<a href="<c:url value="/list?method=preArticle&id=${a.id }"/>">
<img src="<c:url value="/resources/images/article/${a.image }"/>" alt="...">
<p style="height: 20px; overflow: hidden;">${a.title }</p>
</a>
<p>
<span class="price">${a.price }</span>
<c:if test="${not empty a.discount }">
<span class="discountPrice">惊爆价: <fmt:formatNumber value="${a.price * a.discount / 10 }" pattern="0.00"></fmt:formatNumber>(${a.discount }折)</span>
</c:if>
</p>
</span>
</div>
</c:forEach>
</div>
<div class="row" >
<!-- 分页标签 -->
<nav>
<ul class="pagination">
<li><a href="${pageContext.request.contextPath}/list?method=getAll&typeCode=${typeCode}&secondType=${secondType}&title=${title}&pageIndex=1">首页</a></li>
<li><a href="${pageContext.request.contextPath}/list?method=getAll&typeCode=${typeCode}&secondType=${secondType}&title=${title}&pageIndex=${pager.currentPageNum-1}">上一页</a></li>
<li><a href="${pageContext.request.contextPath}/list?method=getAll&typeCode=${typeCode}&secondType=${secondType}&title=${title}&pageIndex=${pager.currentPageNum+1}">下一页</a></li>
<li><a href="${pageContext.request.contextPath}/list?method=getAll&typeCode=${typeCode}&secondType=${secondType}&title=${title}&pageIndex=${pager.totalPages}">尾页</a></li>
<li>
<a>总数据量${pager.totalCount},当前<span style="color: red;">${pager.currentPageNum}</span>/${pager.totalPages}</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<hr>
<footer>
<p>© 版权所有,欢迎借鉴</p>
</footer>
</div>
<!-- 弹出框 -->
<div class="modal fade" id="exampleModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="exampleModalLabel">添加物品</h4>
</div>
<div class="modal-body ">
<div align="center">
<span style="color:red;"></span>
<form name="articleform" class="form-horizontal" action="<c:url value="/list?method=addArticle&typeCode=${typeCode}&secondType=${secondType}&title=${title} "/>" method="post" enctype="multipart/form-data">
<div class="form-group">
<label class="col-sm-3 control-label">类型编号:</label>
<div class="col-sm-4">
<select class="form-control" name="code" id="addTypeCode">
<c:forEach items="${articleTypes}" var="type">
<option value="${type.code}">${type.name}</option>
</c:forEach>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">标题:</label>
<div class="col-sm-4">
<input type=text class="form-control" name="titleStr" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">供应商:</label>
<div class="col-sm-4">
<input type=text class="form-control" name="supplier" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">地区:</label>
<div class="col-sm-4">
<input type=text class="form-control" name="locality" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">价格:</label>
<div class="col-sm-4">
<input type=text class="form-control" name="price" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">库存数量:</label>
<div class="col-sm-4">
<input type=text class="form-control" name="storage" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">上架日期:</label>
<div class="col-sm-4">
<input class="form-control" name="putawayDate" id="putawayDate"
style="width: 180px;" type="text" class="Wdate"
onclick="WdatePicker({'lang':'zh-cn','skin':'whyGreen','dateFmt':'yyyy-MM-dd HH:mm:ss'})" size="50">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">物品封面:</label>
<div class="col-sm-4">
<input type="file" class="form-control" name="image" size="40" />
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">书面描述:</label>
<div class="col-sm-6">
<textarea rows="5" cols="60" class="form-control" name="description"></textarea>
</div>
</div>
<table>
<tr>
<td><input type="submit" class="btn btn-success btn-sm" value="提交" /></td>
<td> <input type="button" class="btn btn-danger btn-sm" data-dismiss="modal" value="取消" /></td>
</tr>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 横幅下方的主体结束 -->
<!-- 一般来讲,css必须在head里面引入,因为页面加载完成,就需要显示正确的样式 -->
<!-- js一般在页面最后面加载,等页面布局都完成以后,再来处理js文件! -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="${pageContext.request.contextPath }/resources/jquery/jquery.js"></script>
<script src="${pageContext.request.contextPath }/resources/bootstrap/js/bootstrap.js"></script>
<script src="${pageContext.request.contextPath }/resources/js/taobao.js"></script>
<script type="text/javascript">
//在整个加载完后再为二级类型绑定切换事件
$("#secondType").change(function () {
window.location="${pageContext.request.contextPath}/list?method=getAll&typeCode=${typeCode}&secondType="+this.value;
});
//把二级类型选中
$("#secondType").val("${secondType}");
</script>
</body>
</html>在request获取元素之前也设置了编码格式,list头文件也设置了编码格式,为何还会出现回写乱码呢?
24
收起
正在回答 回答被采纳积分+1
3回答
SSM主流框架入门与综合项目实战2018版
- 参与学习 人
- 提交作业 205 份
- 解答问题 4317 个
Java中非常实用的SSM整合开发内容,从Spring开始,到MyBaits的进阶内容,再到SpringMVC的应用,最后是SSM整合开发案例,逐步深入,助你成长为一名Java工程师!
了解课程
这里,改成:
保持一致。试一下~~


恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星