.Net Project/Jquery 1.3.2

68장 JQueryAjax ajax() JSON 대체 (jQuery.ajax.JSON)

Magic_kit 2009. 11. 25. 10:09
반응형
jQuery.ajax.JSON.htm
 

<!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>getJSON()을 대체하는 ajax() 메서드</title>

    <script src="../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            // 동적으로 원격에있는 JSON파일을 로드

            $.ajax({

                url: "02.jQuery.getJSON.js", // a.aspx, a.php, a.jsp

                dataType: "json",

                success: function (data) {

                    // 받아온 JSON을 테이블에 출력
                    $.each(data, function () {

                        $('#tblList').append("<tr><td>" + this.Num + "</td><td>"

                            + this["Name"] + "</td></tr>");

                    });

                    $.each(data, function (index, entry) {

                        $('#tblList').append("<tr><td>" + entry.Num + "</td><td>"

                            + entry["Name"] + "</td></tr>");

                    });

                },

                error: function () { alert("에러 발생"); }

            });

        });

    </script>

</head>

<body>

    <table id="tblList" border="1"></table>

</body>

</html> 


 02.jQuery.getJSON.js

[

    {

        "Num": "1",

        "Name": "홍길동"

    },

    {

        "Num": "2",

        "Name": "백두산"

    },

    {

        "Num": "3",

        "Name": "한라산"

    }

] 







반응형