Jquery Ajax--- get,post,ajax方法返回json数据

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
</head>
<body>
    <input type="text" id="r">
    <button id="btn1"> calc area and round</button><br>
    <span id="span1"></span>
    <script type="text/javascript">
        $(function() {
            $("#btn1").click(function() {
                  
                //$.get(url,paras,callback)
                //$.get("data.php",{"r":$("#r").val()},function(data,status){
                // var txt="("+data+")";
                // var obj_json=eval(txt);
                // $("#span1").html("圆的面积为:"+obj_json.area+"<br>圆的周长为:"+obj_json.len);
                //});
 
                //$.post(url,paras,callback,type)
                // $.post("data.php",{"r":$("#r").val()},function(data,status){
                //  $("#span1").html("圆的面积为:"+data.area+"<br>圆的周长为:"+data.len);
                //  // alert(data);
                // },"json");
 
                $.ajax({
                    url:'data.php',
                    data:{r:$("#r").val()},
                    type:'POST',
                    dataType:'json',
                    success:function(data) {
                        $("#span1").html("圆的面积为:"+data.area+"<br>圆的周长为:"+data.len);
                    }
                });
            });
        });
    </script>
</body>
</html>

  data.php

1
2
3
4
5
6
7
8
9
<?php
    if(isset($_POST["r"])){
        $r=intval($_POST["r"]);
        $area=pi()*$r*$r;
        $len=2*pi()*$r;
        $str='{"area":'.$area.',"len":'.$len."}";
        echo $str;
    }
?>

  

posted @   框框A  阅读(332)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示