ajax之get、post

异步获取数据:

<script type="text/javascript">
/**
 * [showstatus 获取数据]
 * @return {[type]} [description]
 */
function showstatus()
{ 

    /**
     * [用post方式获取数据]
     * @param  {[type]} user       [网页用户名]
     * @param  {[type]} password  [网页用户名密码]
     * @param {[type]}  type          []
     */
    $.get("/demo/web/status/class.curstatus.php",{user:"admin",password:"admin",type:0},function(data, textStatus, xhr) 
        {
            // $("#datashow").html(data);
            var statusArr = eval("("+data+")");
            var curstatusArr = statusArr['info'];  
            // console.log(curstatusArr);

            for (var i = 0; i < curstatusArr.length; i++) {
                 for(var key in curstatusArr[i])
                 {
                     $("#"+key+i).text(curstatusArr[i][key]);
                 }
            };          

        });

    setTimeout("showstatus()",10000);
}

  $(function(){
      showstatus();
  }); 
</script>

异步提交数据：

 

<script type="text/javascript">


  $(function() {
          $("#product_uuid").focus();
          // alert(new Date());

          $("#submit").submit(function ()
          {
              // guard_form_submit.php
              jQuery.ajax({
                  url:'guard_form_submit.php',
                  type: 'post',
                  // dataType: 'text',
                  data:$("#guard_form").serialize(),
                  success: function (data) {


                      if(data.length > 0)
                      {
                          console.log(data)

                        if(data == "success")
                        {
                             // alert("hhhhhhhhh");
                             $("#addBox").text("保存成功");
                        }
                        else
                        {

                             $("#addBox").text("保存失败");
                          
                        }
                        
                          $("#product_uuid").focus();
                          $("#product_uuid").val("");

                  
                        $("#addBox").toggle(1000);
                        // $("#addBox").toggle(1000);
                        

                      }

                      

                  }



              })
          })


  });    



</script>

 要点：

  1、使用$.get，$.post进行参数传递时，key不能为变量，只能字符串

　　　　

       var sParam = arr[0]+"_"+arr[1];

       $.post('485_info_configuration_submit.php', {"Port": arr[0],"Type":arr[1],sParam:$("#"+sParam).val()}, function(data, textStatus, xhr) {}

  sParam不能的变量值不能传递。实际的key值为sParam，而非sParam的变量值

  2、表单的序列化

    serialize()序列，转化为字符串，类似a=1&b=2&c=3

    serializeArray()序列化， json数据，后台可以直接用数组进行获取解析

   后台用Post获取到的数据分别为:

 

Array
(
    [serialForm] => returnURL=485_info_configuration.php&Port=4&Type=PowerCtrlStatus&1_PowerCtrlStatus=1&1_OutSingalStatus=0&2_PowerCtrlStatus=1&2_OutSingalStatus=0&3_PowerCtrlStatus=1&3_OutSingalStatus=0&4_PowerCtrlStatus=1&4_OutSingalStatus=1&5_PowerCtrlStatus=1&5_OutSingalStatus=0&6_PowerCtrlStatus=1&6_OutSingalStatus=0&7_PowerCtrlStatus=1&7_OutSingalStatus=1&8_PowerCtrlStatus=1&8_OutSingalStatus=0&9_PowerCtrlStatus=1&9_OutSingalStatus=1&10_PowerCtrlStatus=1&10_OutSingalStatus=0&11_PowerCtrlStatus=1&11_OutSingalStatus=1&12_PowerCtrlStatus=1&12_OutSingalStatus=0
)





(
    [serialForm] => Array
        (
            [0] => Array
                (
                    [name] => returnURL
                    [value] => 485_info_configuration.php
                )

            [1] => Array
                (
                    [name] => Port
                    [value] => 4
                )

            [2] => Array
                (
                    [name] => Type
                    [value] => PowerCtrlStatus
                )

            [3] => Array
                (
                    [name] => 1_PowerCtrlStatus
                    [value] => 1
                )

            [4] => Array
                (
                    [name] => 1_OutSingalStatus
                    [value] => 0
                )

            [5] => Array
                (
                    [name] => 2_PowerCtrlStatus
                    [value] => 1
                )

            [6] => Array
                (
                    [name] => 2_OutSingalStatus
                    [value] => 0
                )

            [7] => Array
                (
                    [name] => 3_PowerCtrlStatus
                    [value] => 1
                )

            [8] => Array
                (
                    [name] => 3_OutSingalStatus
                    [value] => 0
                )

            [9] => Array
                (
                    [name] => 4_PowerCtrlStatus
                    [value] => 1
                )

            [10] => Array
                (
                    [name] => 4_OutSingalStatus
                    [value] => 1
                )

            [11] => Array
                (
                    [name] => 5_PowerCtrlStatus
                    [value] => 1
                )

            [12] => Array
                (
                    [name] => 5_OutSingalStatus
                    [value] => 0
                )

            [13] => Array
                (
                    [name] => 6_PowerCtrlStatus
                    [value] => 1
                )

            [14] => Array
                (
                    [name] => 6_OutSingalStatus
                    [value] => 0
                )

            [15] => Array
                (
                    [name] => 7_PowerCtrlStatus
                    [value] => 1
                )

            [16] => Array
                (
                    [name] => 7_OutSingalStatus
                    [value] => 1
                )

            [17] => Array
                (
                    [name] => 8_PowerCtrlStatus
                    [value] => 1
                )

            [18] => Array
                (
                    [name] => 8_OutSingalStatus
                    [value] => 0
                )

            [19] => Array
                (
                    [name] => 9_PowerCtrlStatus
                    [value] => 1
                )

            [20] => Array
                (
                    [name] => 9_OutSingalStatus
                    [value] => 1
                )

            [21] => Array
                (
                    [name] => 10_PowerCtrlStatus
                    [value] => 1
                )

            [22] => Array
                (
                    [name] => 10_OutSingalStatus
                    [value] => 0
                )

            [23] => Array
                (
                    [name] => 11_PowerCtrlStatus
                    [value] => 1
                )

            [24] => Array
                (
                    [name] => 11_OutSingalStatus
                    [value] => 1
                )

            [25] => Array
                (
                    [name] => 12_PowerCtrlStatus
                    [value] => 1
                )

            [26] => Array
                (
                    [name] => 12_OutSingalStatus
                    [value] => 0
                )

        )

)

 

3、

     1、var sPost = 'Port:"'+arr[0]+'",Type:"'+arr[1]+'",'+sParam+':"'+$("#"+sParam).val()+'"'; 
      $.post('485_info_configuration_submit.php', {sPost}, function(data, textStatus, xhr) {}
    
    2、
      $.post('485_info_configuration_submit.php', {Port: arr[0],Type:arr[1],val:$("#"+sParam).val()}, function(data, textStatus, xhr) {}
    

后台用POST获取到的数据分别是:

 

Array
(
    [Port] => 3
    [Type] => PowerCtrlStatus
    [val] => 1
)



Array
(
    [sPost] => Port:\"3\",Type:\"PowerCtrlStatus\",3_PowerCtrlStatus:\"1\"
)