html代码（test.html），js在html底部

<!DOCTYPE html>

<html lang="en">

<head>

   <meta charset="UTF-8">

   <title>test-jquery-ajax-list</title>

</head>

<body>

<div class="main">

   <table>

      <thead>

      <tr>

         <th>id</th>

         <th>name</th>

         <th>sex</th>

         <th>time </th>

      </tr>

      </thead>

      <tbody id="infolist">

      </tbody>

   </table>

</div>

</body>

<script src="http://apps.bdimg.com/libs/jquery/1.11.1/jquery.js"></script>

<script type="text/javascript">

   $(document).ready(function(){

      getList();

      function getList(){

         // jquery ajax 请求

         $.ajax({

            type:'post', //请求方式，默认get

            url :"http://localhost/ajax-demo-list/test.php",

            data:{

               getFunction:1

            },success:function(data,status){

               $('#infolist').html('');

               $str = '';

               $.each(data.list,function(i,val){

                  $str = $str + '<tr>';

                  $str = $str + '<td> '+val.id+'  </td>';

                  $str = $str + '<td> '+val.name+'  </td>';

                  $str = $str + '<td> '+val.sex+'  </td>';

                  $str = $str + '<td> '+val.time+'  </td>';

                  $str = $str + '</tr>';

               });

               $('#infolist').append($str);

               if(data.list == "" ||  data.list.length < 0 || data.list == "undefined"){

                  $('#infolist').html('<td colspan="10"  style="height:200px;text-align:center;color: #23527c">暂无相关数据...</td>');

               }

            },error:function(data,statsu){

               alert("发送请求失败！");

            }

         });

      }

   });

</script>

</html>

php代码 （test.php）

<?php

header("Content-Type: application/json;charset=utf-8");

if($_REQUEST['getFunction']){

   getList();

}

function getList(){

   $data  = array(

      array(

         'id'   => 1,

         'name' => 'xiaoming',

         'sex'  => '男',

         'time' => '2016年1月22日 14:45:46'

      ),

      array(

         'id'   => 2,

         'name' => '老张',

         'sex'  => '男',

         'time' => '2016年1月22日 14:45:46'

      ),

      array(

         'id'   => 3,

         'name' => '捞王',

         'sex'  => '男',

         'time' => '2016年1月22日 14:45:46'

      )

   );

   $list  = json_encode(array('list'=>$data));

   print_r($list);

   //    print_r(json_encode(array('list'=>$data=array())));

}

　　

jQuery ajax 请求php遍历json数组到table中的更多相关文章

  1. jQuery通过ajax请求php遍历json数组到table中的代码

    html代码(test.html),js在html底部 具体代码如下所示: <!DOCTYPE html> <html lang="en"> <hea ...

  2. jQuery ajax 传递JSON数组到Spring Controller

    jQuery ajax传递单个JSON对象到后台很容易,这里记录的是传递多个JSON对象组成的JSON数组到java 后台,并说明java如何解析JSON数组. 1.js代码 var relation ...

  3. JQuery ajax请求struts action实现异步刷新的小实例

    这个样例是用JQuery ajax和struts来做的一个小样例,在这个样例中采用两种方式将java Util中的list转换成支json的格式,第一种是用json-lib.jar这个jar包来转换, ...

  4. jquery Ajax请求示例，jquery Ajax基本请求方法示例

    jquery Ajax请求示例,jquery Ajax基本请求方法示例 ================================ ©Copyright 蕃薯耀 2018年5月7日 https: ...

  5. jquery.ajax请求aspx和ashx的异同 Jquery Ajax调用aspx页面方法

    1.jquery.ajax请求aspx 请求aspx的静态方法要注意一下问题: (1)aspx的后台方法必须静态,而且添加webmethod特性 (2)在ajax方法中contentType必须是“a ...

  6. 原生js，jquery ajax请求以及jsonp的调用

    ajax    是用来处理前后端交互的技术,可以改善用户体验,其本质是    XMLHttpRequest,异步访问服务器并发送请求数据,服务器返回响应的数据,以页面无刷新的效果改变页面中的局部内容  ...

  7. jQuery ajax请求错误返回status 0和错误error的问题

    上周发现一个jQuery ajax请求错误返回status 0和错误error的问题,responseText是"error",状态码是0而不是200: $.ajax({ type ...

  8. 二、jQuery Ajax请求

    一.Ajax请求 1.jQuery Ajax请求 let ajaxTimeOut = $.ajax({ //将网络请求事件赋值给变量ajaxTimeOut url: "/api_v1.1/a ...

  9. jquery ajax请求方式与提示用户正在处理请稍等，等待数据返回时loading的显示

    1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...

随机推荐

  1. C 高级编程 1

    内存管理层次: 硬件层次: 内存结构管理 内核算层次: 内存映射 堆扩展 数据结构层次: 智能指针: stl :在多线程,共享内存有问题 SGI公司实现了STL ,开发了OPENGL库 语言层次:C: ...

  2. qsort函数、sort函数 (精心整理篇)

    先说明一下qsort和sort,只能对连续内存的数据进行排序,像链表这样的结构是无法排序的. 首先说一下, qsort qsort(基本快速排序的方法,每次把数组分成两部分和中间的一个划分值,而对于有 ...

  3. linux下使用find xargs grep查找文件及文件内容

    1,在某个路径下查文件. 在/etc下查找“*.log”的文件 find /etc -name “*.log” 2,扩展,列出某个路径下所有文件,包括子目录. find /etc -name “*” ...

  4. 网口扫盲三:以太网芯片MAC和PHY的关系

    转载:http://www.cnblogs.com/jason-lu/articles/3195473.html   问:如何实现单片以太网微控制器? 答:诀窍是将微控制器.以太网媒体接入控制器(MA ...

  5. akw、grep、sed常用命令

    awk 求和 cat data|awk '{sum+=$1} END {print "Sum = ", sum}' 平均值 cat data|awk '{sum+=$1} END ...

  6. cocos2dx新建android项目lib拷贝、访问权限等问题集

    win7上面搭建cocos2dx的android项目,用create-android-project.bat新建一个项目时,出现了访问权限和项目无lib的问题. 解决方案: 1.项目无lib问题. 当 ...

  7. oracle pl/sql简介、块、过程

    pl/sql语言是oracle在sql上扩展的语言.1 过程.函数.触发器是在pl/sql编写2 过程.函数.触发器是在oracle中3 pl/sql的语句可以在java中直接调用 简单介绍 在sql ...

  8. hibernate 查询

                String hql = "select * from Commodity where commodityName like :commodityname" ...

  9. 从医生看病和快餐店点餐理解Node.js的事件驱动

    第一个例子是关于医生看病. 在美国去看医生,需要填写大量表格,比如保险.个人信息之类,传统的基于线程的系统(thread-based system),接待员叫到你,你需要在前台填写完成这些表格,你站着 ...

  10. [改善Java代码]使用匿名类的构造函数

    建议39: 使用匿名类的构造函数 阅读如下代码,看看是否可以编译: public class Client { public static void main(String[] args) { Lis ...