JQuery中AJAX的操作

提交ajax请求

$.ajax({
   url: page,
   data:{"name":value},
   success: function(result){
      $("#checkResult").html(result);
   }
});

 

• $.ajax采用参数集的方式 {param1,param2,param3} 不同的参数之间用,隔开
• 第一个参数 url:page 表示访问的是page页面
• 第二个参数 data:{name:value} 表示提交的参数
• 第三个参数 succeqss: function(){} 表示服务器成功返回后对应的响应函数

例

<script>
$(function(){
   $("#name").keyup(function(){
     var page = "/study/checkName.jsp";//要访问的路径
     var value = $(this).val();        //要传的参数
        $.ajax({
            url: page,
            data:{"name":value},
            success: function(result){
              $("#checkResult").html(result);
            }
        });
   });
}); 
</script>

 

使用post方式提交ajax请求

$.post 是 $.ajax的简化版，专门用于发送post请求

$.post(
    page,
    {"name":value},
    function(result){
        $("#checkResult").html(result);
    }
);

• 第一个参数: page 访问的页面
• 第二个参数: {name:value} 提交的数据
• 第三个参数: function(){} 响应函数

例

<script>
$(function(){
   $("#name").keyup(function(){
     var page = "/study/checkName.jsp";
     var value = $(this).val();
  
　　　　　　//相比于ajax请求，在路径与数据还有函数前面少了相应的标识 url,value,success
        $.post(
            page,
            {"name":value},
            function(result){
              $("#checkResult").html(result);
            }
        );
   });
});

 

使用get方式提交ajax

$.get 是 $.ajax的简化版，专门用于发送GET请求

$.get(
            page,
            {"name":value},
            function(result){
              $("#checkResult").html(result);
            }
);

 

• 第一个参数: page 访问的页面
• 第二个参数: {name:value} 提交的数据
• 第三个参数: function(){} 响应函数
• 只有第一个参数是必须的，其他参数都是可选

例

<script>
$(function(){
   $("#name").keyup(function(){
     var page = "/study/checkName.jsp";
     var value = $(this).val();
 　　　　　　//get与post类似
        $.get(
            page,
            {"name":value},
            function(result){
              $("#checkResult").html(result);
            }
        );
   });
});
</script>