Ajax拒绝获取服务器时间

时间:2013-03-24 00:39:18

标签: php javascript ajax

我一直在关注我正在阅读的Ajax书中的一个例子。

我按照指示将代码放在一起。想法是获取php服务器时间并在单击按钮时显示它。

该出版物是2006年,我不确定我写的任何内容是否已经过时,可能不再受支持导致其中断?

我很感激任何指导,谢谢!

AJAX页面

<!DOCTYPE html>
<html>
<head>
    <title>Ajax Demonstration</title>
    <style>
        .displaybox{
            width: 150px;
            margin:0 auto;
            background-color: #fff;
            border: 2px solid #000;
            padding: 10px;
            font:24px normal verdana, helvetica, arial, sans-serif;
        }
    </style>
    <script language="JavaScript" type="text/javascript">
        function getXMLHTTPRequest(){
            try{
                reg = new XMLHttpRequest();
            }
            catch(err1){
                try{
                    req = new ActiveXObject("Msxm12.XMLHTTP");
                }
                catch(err2){
                    try{
                        req = new ActiveXObject("Microsoft.XMLHTTP");
                    }
                    catch(err3){
                        req = false;
                    }
                }
            }
        }

        var http = getXMLHTTPRequest();

        function getServerTime(){
            var myurl = 'telltimeXML.php';
            myRand = parseInt(Math.random()* 999999999999999);
            //add random number to URL to avoid cache problems
            var modurl = myurl+"?rand="+myRand;
            http.open("GET", modurl, true);
            //set up the callback function
            http.onreadystatechange = useHttpResponse;
            http.send(null);
        }

        function useHttpResponse(){
            if(http.readyState == 4){
                if(http.status == 200){
                    var timeValue = http.responseXML.getElementsByTagName("timenow")[0];
                    document.getElementById('showtime').innerHTML = timeValue.childNodes[0].nodeValue;
                }
            }
            else{
                document.getElementById('showtime').innerHTML = '<img src="anim.gif">';
            }
        }
    </script>
</head>
<body style="background-color:#ccc; text-align:center" onLoad="getServerTime()">
    <h1>Ajax Demonstration</h1>
    <h2>Getting the server time without page refresh</h2>
    <form>
        <input type="button" value="Get Server Time" onClick="getServerTime()" />
    </form>
    <div id="showtime" class="displaybox"></div>
</body>

PHP页面

<?php
header('Content-Type: text/xml');
echo "<?xml version='1.0' ?><clock1><timenow>".date('H:i:s')."</timenow></clock1>";
?>

1 个答案:

答案 0 :(得分:2)

这一行:

var http = getXMLHTTPRequest();

期待getXMLHttpRequest()return该实例。但是,function正在尝试直接设置req

// ...

req = new XMLHttpRequest();

// ...

最简单的解决方案可能是将每个req =更改为return

function getXMLHTTPRequest(){
    try{
        return new XMLHttpRequest();
    }
    catch(err1){
        // etc.
    }
}

尽管如此,您也可以更快地声明http并直接设置它:

var http;

function getXMLHTTPRequest(){
    try{
        http = new XMLHttpRequest();
    }
    catch(err1){
        // etc.
    }
}

getXMLHttpRequest(); // no need for `http =` here, since they're in the function