網頁

2013年3月26日 星期二

jQuery Ajax Examples


jQuery ajax - get() 方法


深入理解jQuery中$.get、$.post、$.getJSON和$.ajax的用法



jQuery Ajax Examples


 $.ajax({
         url: 'db/submenu.php',
         datatype: "json",
         data: 'dbMebuGroup=txt',//参数
         type: 'get',
         success: function (e) {   //成功后回调
             alert(e); 
            //panToLocHTML = e;
         },
         error: function(e){    //失败后回调
             alert(e);
         },
         beforeSend: function(){  //发送请求前调用,可以放一些"正在加载"之类额话
             alert("正在加载");
         }
 }); 

 
 $.ajax({
         url: 'db/submenu.php',
         datatype: "json",
         data: {"dbMebuGroup":"txt"},//参数
         type: 'POST',
         success: function (e) {   //成功后回调
             alert(e); 
            //panToLocHTML = e;
             useYourDataQueryFromPHP(); //重要!一定要確認成功再執行 資料的調用程式的載入
         },
         error: function(e){    //失败后回调
             alert(e);
         },
         beforeSend: function(){  //发送请求前调用,可以放一些"正在加载"之类额话
             alert("正在加载");
         }
 }); 

 
重要技巧 ajax順序查詢 (因應資料庫查詢會成功先回傳 而變亂序)
 
      
    elemArray =[];

    var getData;
    var url = dbPath + "db_submenu.php";

  var index = 0;
     $(".task > li").each(function(){
    var i = index;
    data = $(this).attr("id");//+"_";
    getData =  'dbGroup='+ data ;
 
             $.ajax({
             url: url,
             datatype: "json",
             data: getData,
             type: 'get',
              success: function (e) {   //成功后回调
                
                  //elemArray.push(e);
                  elemArray[i] = e;

       
              }
      });
       
            index++;
  }); //end of getDB 
 
進階技巧 ajax依查詢結果抽換指定li的樣式
function getDBquerySomeonelist(li_class,i)
{ 

     var htmlStr   = $('ul.task').find('li.'+li_class).html();

     htmlStr  = "" +" "+  htmlStr +"
";  

     

     $('ul.task').find('li.'+li_class).html(htmlStr);


}
function getDB() {


  elemArray =[];

    var getData;
    var url = dbPath + "db_submenu.php";

   

  var index = 0;


  //var countLI = $(".task > li").size();

     $(".task > li").each(function(){
    var i = index;
    data = $(this).attr("id");
    var li_class = data;
    getData =  'dbMissionGroup='+ data ;
 
             $.ajax({
             url: url,
             datatype: "json",
             data: getData,
             type: 'get',
              success: function (e) {   //成功后回调
                
                  
                  elemArray[i] = e; //設定成像字典的效果
                  getDBquerySomeonelist(li_class,i); //先查到先回 所以會亂數
       
              }
      });
       
            index++;
  }); 


}
    

 

沒有留言:

張貼留言

注意:只有此網誌的成員可以留言。