您的位置:首页 > Web前端 > JQuery

jquery ajax post方法获取json数据

2015-11-27 12:53 591 查看
前端

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>无标题文档</title>
<script src="images/jquery.min.js"></script>
</head>
<body>
<script>

/* $.post函数 */

$(document).ready(function () { $("#btn").click(function () { var price = $("#price").val(); $.post("ajax.php", {"symbol": price}, function (data, textstatus) { $("#heigh").html(data.h); $("#midle").html(data.m); $("#low").html(data.l); }) }) })

/* $.ajax函数 */
/*    $(document).ready(function () {
$("#btn").click(function () {
$.ajax({
type: "POST",
url: "ajax.php",
data: {"symbol": $("#price").val()},
datatype: "json",
success: function (data) {
$("#heigh").html(data.h);
$("#midle").html(data.m);
$("#low").html(data.l);
}
});
});
});*/


</script><form> <input type="text" id="price"> <input type="button" id="btn" value="submit"></form><div>heigh:<span id="heigh"> </span></div><div>midle:<span id="midle"> </span></div><div>low:<span id="low"> </span></div></body></html>

php

<?php

$k =$_POST["symbol"];

switch($k){
case 'msft':
$v=array("h"=>"100" , "m"=>"80" , "l"=>"50");
break;

case 'goog':
$v=array("h"=>"200" , "m"=>"180" , "l"=>"150");
break;

case 'aapi':
$v=array("h"=>"300" , "m"=>"280" , "l"=>"250");
break;
}
$json=json_encode($v);
header("content-type:application/json");
echo $json;

?>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: