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>