AJax的使用json数据的传输回调函数

来源:互联网 发布:台灯哪个牌子好 知乎 编辑:程序博客网 时间:2024/06/06 09:22

用 eval()函数进行解析,把数据解析成对象模型,内容就成了对象的属性。

<!DOCTYPE html>

<html>
    <head>
        <meta charset="utf-8" />
        <title>Ajax的基本使用和封装</title>
    </head>
    <body>
        <input type="button" id="divNextId" value="下一页"/>
        <div id="DivUserNameId"style="width: 500px; height: 500px; background-color: #ccc;"></div>
    </body>
    <script type="text/javascript">
        // 封装的ajax方法。
        function creatXmlHttp(url){
            //第一步创建一个XMLHttpRequest对象,兼容IE低版本
            var varXmlr = null;
            if(window.XMLHttpRequest){
                varXmlR = new XMLHttpRequest();
            }else{
                var varXmlR = new ActiveXObject("Micrsoft.XMLHTTP");
            }
            
            varXmlR.onreadystatechange = function (){
                //判断是否正确返回数据
                if(varXmlR.readyState==4 && varXmlR.status==200){
                    action(varXmlR.responseText);
                }
            }
            // 打开某个网页
            varXmlR.open("GET",url,true);
            // 发送请求数据
            varXmlR.send();
        }
        
        var myBtnNext = document.getElementById("divNextId");
        var myDivUserName = document.getElementById("DivUserNameId");
        
        myBtnNext.onclick = function(){
            creatXmlHttp("test1.txt");
        }
        function action(date){
            var dateee = eval("("+date+")"); // 解析数据成模型
            myDivUserName.innerHTML = dateee.people[2];
            
        }
    </script>

</html>



1 0
原创粉丝点击