java：（json，ajax，path）_H5之家 - 中国HTML5教程资源分享第一站

1.json：

2.ajax：　　

　　又称为局部刷新
　　Asynchronous Javascript And XML(异步的js和xml文档)
　　是一种新的交互式技术
　　一般用处：分页，三级联动...

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "http://www.itdadao.com/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="http://www.cnblogs.com/kuangzhisen/p/"> <title>My JSP 'login.jsp' starting page</title> <script type="text/javascript" src="http://www.cnblogs.com/kuangzhisen/p/js/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function() { $("#uname").on("blur", function() { var username = $("#uname").val(); if (username != null && username != "") { // 获取到了用户输入的username的值 // 以get的请求方式发送(我乐意！) /* $.get("user.sxt", "type=checkUsername&username=" + username, function(data) { // 服务器端返回的数据 // data是形式参数，接收的是服务器端(servlet)返回回来的数据 }); */ // 以post的请求方式发送 /* $.post("user.sxt", "type=checkUsername2&username="+username, function(data){ }); */ // 无论用post还是get /** $.post/get("请求的地址(url)", "需要传递的参数", function(data){ // 服务器端向客户端响应的数据(json) }); */ // 究极版本的ajax // ajax的终极版本，同样遵循json的格式，key : value为一个整体，每个key和value用:隔开,每一个键值对之间用逗号隔开，最后一个键值对不能有逗号 /* $.ajax({ async : true, //(是否异步，默认为true) data : {"type":"checkUsername", "username" : username}, // 客户端向服务器端发送的数据，类型为object method : "get", // 请求方式(get/post) //type和method是一样的，都是选择请求的方式，在jQuery1.9版本之前用type，之后用method url : "user.sxt", // 客户端向服务器端发送数据的地址--->请求地址 success : function(data) { // 当成功响应以后，接收到的数据-->服务器端向客户端响应的数据 alert(data);// data服务器端向客户端响应的数据 } }); */ // function(data)只能接收字符串 /* $.get("user.sxt", "type=checkUsername&username=" + username, function(data) { // 服务器端返回的数据 // data是形式参数，接收的是服务器端(servlet)返回回来的数据 alert(data); }); */ // function(data)只能接收json对象 $.getJSON("user.sxt", "type=checkUsername&username=" + username, function(data){ alert(data.username); }); } }); }); </script> </head> <body> 用户名： <input type="text" /> </body> </html>

　　UserServlet：

package cn.zzsxt.lee.web.servlet; import java.io.IOException; 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 com.google.gson.Gson; import cn.zzsxt.lee.web.entity.User; @WebServlet("/user.sxt") public class UserServlet extends HttpServlet { @Override protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); response.setContentType("text/html;charset=UTF-8"); String method = request.getMethod().toLowerCase(); System.out.println(method); String type = request.getParameter("type"); if ("get".equals(method) && "checkUsername".equals(type)) { checkUsername(request, response); } else if("post".equals(method) && "checkUsername2".equals(type)) { checkUsername2(request, response); } } private void checkUsername2(HttpServletRequest request, HttpServletResponse response) { String username = request.getParameter("username"); System.out.println("------------------------------"+username); // 从数据库中查询是否存在zhangsan这个用户名 } private void checkUsername(HttpServletRequest request, HttpServletResponse response) throws IOException { String username = request.getParameter("username"); System.out.println("------------------------------"+username); // 从数据库中查询是否存在zhangsan这个用户名 User user = new User(); user.setUsername(username); //response.getWriter().print(username+":天青色等烟雨，而我在等你");// 服务器向客户端响应的数据 // 把user对象拆开，拼成一个json格式的字符串 Gson gson = new Gson(); String json = gson.toJson(user); response.getWriter().print(json); // response.getWriter().print(new Gson().toJson(user)); } }

3.path：

　　UserServlet：