jqury ajax 方法小总结

 

//jsp中代码：

<%--
 基于JQuery的ajax方法，一共有三步。
     第一步：前台触发事件，将数据传递给后台处理。
     第二步：后台接收到前台发送的数据，做完逻辑处理后，回送到前台。
     第三步：前台接收到后台处理完的数据，展示到页面上。
 --%>
<script type="text/javascript">
 function ToCheckUserName(){
  var username = document.getElementById("username").value;
  $.ajax({
   //url，表示需要请求的地址。这里我用的是相对路径，一般用绝对路径较好
   url:"CheckName.action",
   //data，使用JSON格式，向后台传数据，userName为数据名，username为值
   data:{userName:username},
   //dataType，后台回传给前台时使用的数据格式
   dataType:"text",
   //async，表示是否为异步请求，一般为true
   async:true,
   //success和error，两个回调方法，只调用一个，成功success，失败error
   success:function(data){
    document.getElementById("span").innerHTML = data;
   }
   /*
   error:function(data){
    
   }
   */
  });
 }
</script>

其中不要忘记导入jquery，即在上面代码上加上

<script src="js/jquery-1.11.2.js" type="text/javascript"></script>                //其中js为webcontent下的一个文件夹

 

服务器端代码如下：

PrintWriter out = response.getWriter();
    out.write("向页面显示的内容");

load()初尝试

load() 方法通过 AJAX 请求从服务器加载数据，并把返回的数据放置到指定的元素中。

load(url,data,function(response,status,xhr))

 

 

参数	描述
url	规定要将请求发送到哪个 URL。
data	可选。规定连同请求发送到服务器的数据。
function(response,status,xhr)	可选。规定当请求完成时运行的函数。 额外的参数： response - 包含来自请求的结果数据 status - 包含请求的状态（"success", "notmodified", "error", "timeout" 或 "parsererror"） xhr - 包含 XMLHttpRequest 对象

 

 例:

加载 feeds.html 文件内容：

$("#feeds").load("feeds.html");