티스토리 뷰
1. ajax_post.html
<!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>
<title> ajax_json </title>
<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
var $J = jQuery.noConflict();
var postVal = 2;
var returnVal = "";
$J(document).ready(function() {
$J("#loadingLayer").ajaxStart(function() {
$J(this).show();
}).ajaxStop(function() {
$J(this).hide();
});
$J("#btn1").click(function(){
$J.post("ajax_json.php", {
"postVal": postVal
}, function(data){
$J.each(data, function(index, value) {
if (index == "name")
{
$J.each(value, function(index2,value2) {
if ($J.isArray(value))
{
alert(index + " : " + value2);
returnVal += index + " : " + value2 + "<br />";
}
else
{
alert(index + " : " + index2 + " : " + value2);
returnVal += index + " : " + index2 + " : " + value2 + "<br />";
}
});
}
else
{
//alert(index + " : " + value);
returnVal += index + " : " + value + "<br />";
}
});
$J("div#divBox").html(returnVal);
}, "json");
});
});
</script>
<style type="text/css">
.loadingLayer{z-index:101; position:absolute; }
.loadingLayer table{width:100%; height:100%; table-layout:fixed}
.loadingLayer table td{text-align:center}
.loadingLayer .clayer{width:310px; margin:0 auto; position:absolute; top:100px; left:300px; overflow:visible; _filter:progid:DXImageTransform.Microsoft.Shadow(color=#cccccc,direction=135,strength=3)}
.loadingLayer .clayer .inner{position:relative; border:2px solid #777; background:#fff; z-index:2; padding:23px 0 14px}
</style>
</head>
<body>
<!-- ajax로딩이미지-->
<div id="loadingLayer" class="loadingLayer" style="display:none">
<table cellspacing="0" summary="로딩 중">
<tr>
<td>
<div class="clayer">
<div class="inner">
<p class="txt_00"><img src="bigWaiting.gif" /></p>
</div>
</div>
</td>
</tr>
</table>
</div>
<input type="button" value="전송" id="btn1" />
<div id="divBox"></div>
</body>
</html>
2. ajax_json.php
<?php
if ($_POST[postVal] == 1) {
//$data = array("name" => "Jone");
$data2 = '{"name":{"FirstName":"KwangSoo","LastName":"Park"},"time":"2010-11-01"}';
} else {
$data2 = '{"name":["Jone1","Jone2"],"time":"2010-11-01"}';
}
echo $data2;
?>
'jQuery' 카테고리의 다른 글
| .trigger() (0) | 2010.12.27 |
|---|---|
| .bind() (0) | 2010.12.27 |
| event.pageX + event.pageY (0) | 2010.12.27 |
| load() 이벤트 처리기 메서드 (0) | 2010.12.26 |
| ready() 이벤트 처리기 메서드 (0) | 2010.12.26 |
- Total
- Today
- Yesterday