Code
<?php
if( isset($_POST['action']) && $_POST['action'] == 'getdata'){
$mydata = array();
for($tmpCount = 0;$tmpCount <10;$tmpCount++){
$mydata[]=array( 'd1'=>rand(1,20),'d2'=>rand(21,40),'d3'=>rand(41,60) );
}
require_once('lib/JSON.php');
$myjson = new Services_JSON();
$jsonvalue = $myjson->encode($mydata);
echo $jsonvalue;
exit();
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数据加载</title>
<script language="javascript" type="text/javascript" src="js/jquery-1.2.6.min.js" ><script>
<script language="javascript" >
function createTableData(){
$.ajax({
type:"post",
url:"jqueryDom.php",
data:{action:'getdata'},
error:function(){
alert('取数据失败');
},
success:function(data,textStatus){
var returndata = eval('('+data+')');
var datacontent = $("#datacontent tbody");
datacontent.html('');
var tr_dom = $('<tr></tr>');
var td_dom = $('<td></td>');
var datalength = returndata.length;
for(var i = 0;i<datalength;i++){
var tmptr = tr_dom.clone();
td_dom.clone().html(returndata[i].d1.toString()).appendTo(tmptr);
td_dom.clone().html(returndata[i].d2.toString()).appendTo(tmptr);
td_dom.clone().html(returndata[i].d3.toString()).appendTo(tmptr);
tmptr.appendTo(datacontent);
}
}
});
}
</script>
</head>
<body>
<input type="button" onclick="createTableData();" value="获取数据"/>
<table id="datacontent" style="border:1px solid" mce_style="border:1px solid" >
<thead>
<tr><th>字段1</th><th>字段2</th><th>字段3</th></tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
<?php
if( isset($_POST['action']) && $_POST['action'] == 'getdata'){
$mydata = array();
for($tmpCount = 0;$tmpCount <10;$tmpCount++){
$mydata[]=array( 'd1'=>rand(1,20),'d2'=>rand(21,40),'d3'=>rand(41,60) );
}
require_once('lib/JSON.php');
$myjson = new Services_JSON();
$jsonvalue = $myjson->encode($mydata);
echo $jsonvalue;
exit();
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数据加载</title>
<script language="javascript" type="text/javascript" src="js/jquery-1.2.6.min.js" ><script>
<script language="javascript" >
function createTableData(){
$.ajax({
type:"post",
url:"jqueryDom.php",
data:{action:'getdata'},
error:function(){
alert('取数据失败');
},
success:function(data,textStatus){
var returndata = eval('('+data+')');
var datacontent = $("#datacontent tbody");
datacontent.html('');
var tr_dom = $('<tr></tr>');
var td_dom = $('<td></td>');
var datalength = returndata.length;
for(var i = 0;i<datalength;i++){
var tmptr = tr_dom.clone();
td_dom.clone().html(returndata[i].d1.toString()).appendTo(tmptr);
td_dom.clone().html(returndata[i].d2.toString()).appendTo(tmptr);
td_dom.clone().html(returndata[i].d3.toString()).appendTo(tmptr);
tmptr.appendTo(datacontent);
}
}
});
}
</script>
</head>
<body>
<input type="button" onclick="createTableData();" value="获取数据"/>
<table id="datacontent" style="border:1px solid" mce_style="border:1px solid" >
<thead>
<tr><th>字段1</th><th>字段2</th><th>字段3</th></tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
引用了一个JSON.php类来生成json数据,php5.2以后的版本~貌似已经自带了~json函数了~
jQuery.ajax函数简单调用来数据提交~