学习日记之JQuery小知识 ajax

最新推荐文章于 2024-07-25 09:24:40 发布

wgj584521

最新推荐文章于 2024-07-25 09:24:40 发布

阅读量94

点赞数

分类专栏： ajax java JQuery 文章标签： javascript java json ViewUI

本文链接：https://blog.csdn.net/wgj584521/article/details/84696722

版权

java 同时被 3 个专栏收录

12 篇文章 0 订阅

订阅专栏

ajax

2 篇文章 0 订阅

订阅专栏

JQuery

2 篇文章 0 订阅

订阅专栏

创建jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'jq1.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript" src="/jquerytest/jquery-1.5.1.js"></script>
  <script type="text/javascript">
  //这里的内容会在文档加载完毕时执行
$(function() {
   $("#xxx").blur(function(){ //当xxx失去焦点
   var value = $("#xxx").val();
 
  $.ajax({
  		url:"/jquerytest/AjaxServlet",//要请求的服务器url
  		data:{val:value},//这是一个对象，他表示请求对象request.getp获取
  		async:true,//是否为异步请求
  		cache:false,//是否缓存结果
  		type:"POST",//请求方式
  		dataType:"json",//服务器返回的数据是什么类型
  		success:function(result){//这个函数会在服务器执行成功时被调用,result是返回值
  			$("label").text(result.name+","+result.age);
  		//	if (result) {
		//		$("label").text("好人");
		//	}else {
		//		$("label").text("坏人");
		//	}
  		}
  	});
  	 
    });
});
  </script>
  </head>
  <body>
用户名<input type="text" name="name" id="xxx"/><label></label><br/>
密  码<input type="password" name="pwd"/>
  </body>
</html>

新建AjaxServlet.java

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class AjaxServlet extends HttpServlet {

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("UTF-8");
		response.setContentType("text/html;charset=utf-8");
		String value = request.getParameter("val");
		if (value.equals("1234")) {
			String str ="{\"name\":\"好人\",\"age\":12}";
			response.getWriter().print(str);
		}else{
			String str ="{\"name\":\"坏人\",\"age\":89}";
			response.getWriter().print(str);
		}
	}	

}

效果：失去焦点变换

wgj584521

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
学习日记之JQuery小知识 ajax

创建jsp&lt;%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt;&lt;%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName(...
复制链接

扫一扫

专栏目录