JavaWeb Ajax详解，Java技术栈面试题

连接服务器

Servlet代码

/**

• 测试Ajax

• @author xray

*/

@WebServlet("/ajax.do")

public class AjaxServlet extends HttpServlet{

@Override

protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

doPost(req,resp);

}

@Override

protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

req.setCharacterEncoding(“UTF-8”);

resp.setContentType(“text/html;charset=UTF-8”);

//获得Ajax发送的参数

String name = req.getParameter(“name”);

//给浏览器发送数据

resp.getWriter().print(name+“你好啊，我是服务器！！！”);

}

}

JQuery的Ajax

=========================================================================

JQuery提供了几种ajax方法：

1. $.ajax

参数：

type 请求方法类型，GET、POST

url 服务器地址，必须

data 请求参数

async 是否异步

success 成功接收数据的回调函数

error 错误情况的回调函数

$.ajax({type:“post”,url:“ajax.do”,data:{username:“张三”},

success:function(text){

更新text数据到页面

}

});

2. $.post

$.post(“URL”,{参数名:值},

function(text){

更新页面

}

);

3. $.get

$.get(“URL?参数”,

function(text){

…

});

使用JQuery的ajax方法

$(function(){

//设置点击事件

$("#test").click(function(){

//使用ajax方法连接服务器

/* $.ajax({type:“POST”,data:{username:“李四”},url:“ajax.do”,

success:function(text){

//更新页面内容

$("#test").text(“服务器说：”+text);

}

}); */

//使用post方法

/* $.post(“ajax.do”,{username:“王五”},

function(text){

//更新页面内容

$("#test").text(“服务器说：”+text);

}

); */

//使用get方法

$.get(“ajax.do?username=赵六”,

function(text){

//更新页面内容

$("#test").text(“服务器说：”+text);

}

);

});

});

Ajax案例

====================================================================

案例：验证注册用户手机号是否存在

1、在UserDAO、UserService添加手机号是否存在查询方法

2、创建Servlet，接受Ajax传来的手机号，进行查询，将结果用流发送给浏览器

3、在添加用户的页面添加Ajax方法，在手机输入框失去焦点时调用验证。

/**

• 查询用户电话是否存在

• @author xray

*/

public class FindUserTelServlet extends HttpServlet{

@Override

protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

doPost(req,resp);

}

@Override

protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

//接受Ajax函数传来的手机号

String user_tel = req.getParameter(“user_tel”);

//调用数据库查询

UserService service = new UserServiceImpl();

boolean find = service.findUserTel(user_tel);

//将结果发送给Ajax

resp.getWriter().print(find);

}

}

注册表单

…