在jQuery中将Ajax相关的操作进行封装,使用时只需在合适的地方调用Ajax相关的方法即可,相比而言,使用jQuery实现Ajax更加简洁,方便
1.$.Ajax()可以通过发送Http请求加载远程数据,是jQuery最底层的Ajax实现,具有较高的灵活性
如果使用jQuery提供的$.Ajax()方法实现发送Ajax异步请求,只需设置几个参数即可。success函数用来处理响应;另外不需要的参数可以不写
$.Ajax()方法类表需要包含在“{”和“}”之间;多个参数之间以“,”隔开;每个参数以“参数名:参数值”的方式书写
<%@ 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 'index.jsp' starting page</title> <script type="text/javascript" src="js/jQuery1.11.1.js"></script> <script type="text/javascript"> //给文本框注册一个失去焦点事件 $(function(){ //等待页面上所有标签完毕后执行 var dom=$("#txtName"); dom.blur(function(){ myjquery(); }); }); function myjquery(){ var dom=$("#txtName"); $.ajax({ url:'<%=path%>/servlet/CheckUserServlet', type:'post', data:{uname:dom.val()}, success:function(today){ //today server 打到 浏览器的数据 alert(today); } }); } </script> </head> <body> <h1>我是Jquery发送Ajax</h1> <input type="text" name="txtName" id="txtName"/> <span id="msg"></span><br/> <input type="password" name="txtPwd"/> </body> </html>
效果: