Ajax
这里的Ajax概念，我也不讲解了，然后我这里只是讲解一个注册会用到的小用法
- 一般注册页面，我们输入用户名，如果不合规
- 后面就会提示红色字体，然而页面却没有刷新
- 这个操作其实就是Ajax可以实现的
- 我们通过Ajax发送异步请求到达Sevlet，然后处理这个请求，同时返回处理的结果集
- 下面我上代码讲解
层次结构
其中的jq2.jsp就是我们的ajax页面，然后跳转到上面Sevlet处理，同时下面的jquery-1.8.3.js是必须导入的一个包，直接复制粘贴就好
jq2.jsp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.8.3.js" ></script>
<script type="text/javascript">
//文档加载完执行
$(function(){
$("#xxx").blur(function(){ //失去焦点时
var value=$("#xxx").val();
$.ajax({
url:"jquerytest/JQuerySevlet",//要请求服务器的url
data:{val:value},//这是一个对象，表示请求的参数，服务器可以通过getparement获取
async:true,//是否异步请求
cache:false,//是否缓存
type:"POST",//请求方式
dataType:"json",//服务器返回类型
success:function(result){ //服务器返回什么类型这里就是什么类型
/* if(result)
$("label").text("好人");
else
$("label").text("坏人"); */
$("label").text(result.name+","+result.age);
}
});
});
});
</script>
</head>
<body>
用户名：<input type="text" name="name" id="xxx"/><label></label><br>
年 龄:<input type="text" name="age" value="qwes"><br>
</body>
</html>
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.8.3.js" ></script>- 这句代码就是导入我们的包，引入我们需要用的东西
- 然后关于ajax的7个参数，我都有注释讲解，同时我们需要知道这个是在文本框失去焦点的时候才调用
- 然后这里的返回类型很重要，例如你用json类型和String类型就是两回事了，例如“true”，json就会解析成布尔值，String就会解析成字符串，这里需要注意没不然很容易出错，常用类型就是xml、json
Sevlet
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String str=(String)request.getParameter("val");
if(str.equals("˧˧ࠕ"))
// response.getWriter().print("true");
response.getWriter().print("{\"name\":\"օɽ\",\"age\":23}");
else
//response.getWriter().print("false");
response.getWriter().print("{\"name\":\"nɽ\",\"age\":83}");
}
- Sevlet代码就很简单了，就是一个判断操作，
- 然后用响应对象写回数据
总结
- 这里需要注意，返回ajax的当成对象处理
- 写回的数据如果是字符串，最好用双引号引起，避免不必要的失误，然后双引号就需要转义符
- 源代码下载链接
915
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
