zoukankan      html  css  js  c++  java
  • 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"
    )
  • 相关阅读:
    劳动手册补办
    敏捷开发之“燃尽图之谜”
    JIra配置权限方案
    Scrum的三个仪式:Sprint规划会,Scrum每日站会,Sprint评审会
    Jira更改工作流后,敏捷看板里无法显示sprint对应的问题列表
    JIRA使用过程出现问题整理解答
    2020系统综合实践 第8次实践作业
    2020系统综合实践 第7次实践作业
    2020系统综合实践 第6次实践作业
    2020系统综合实践 第5次实践作业
  • 原文地址:https://www.cnblogs.com/hzijone/p/5318558.html
Copyright © 2011-2022 走看看