javascript - AJAX 调用 PHP 函数并返回 JSON 时出错

Question

我想使用三种技术开发新闻行情栏:PHP、Javascript 和 AJAX。 首先，我创建了一个 PHP 函数 getFeed() 来从数组上的新闻网站获取数据，然后使用以下代码创建了一个 JSON 返回:echo json_encode($articles, true);

其次，我的目标是使用 AJAX 和 Javascript 重复调用 getFeed() 函数，这是我的 javascript 代码:

<script type="text/javasript">
    var xmlhttp=false;
    function begin() {

        if(window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        }else{
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
        }

        xmlhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200){
                var jsonContent=JSON.parse(this.responseText);
                displayT(jsonContent);

            }
        };

     // rssnews.inc.php contain the getFeed() function

        xmlhttp.open('GET','rssnews.inc.php', true);
        xmlhttp.send();
        }
     // displayT(content) function display the JSON element
        function displayT(content){
            var out = "";
            var i;

            for(i = 0; i < arr.length; i++) {
                out += '<h4><a href="' + arr[i].link+ '">' + 
                arr[i].title + '</a></h4><br>';
            }
            document.getElementById('item').innerHTML = out;
        }
</script>

在 HTML 页面上，我有以下组件:一个按钮 (id="start") - 单击时执行 begin() 函数、一个 div 容器 (id="Ticker") 和一个 div (id="item")，用于使用 AJAX 显示数据

<form>
    <button type="submit" class="btn btn-default" id="start" onclick="begin();"> START </button>
</form>

<div  id= "ticker" style="border: 1px solid #ccc; height: 500px; weight:600px;">

    <div id="item">
        <!-- I want to display the fetched data by 4 items at a specific time Interval-->           
    </div>

</div>

当我点击开始按钮时，我没有得到json数据。

如何解决这个问题以及如何确保此 AJAX 调用是最适合我的 Ticker 的方式。 谢谢你!

Answer 1

该错误本质上是说您尝试通过 AJAX 调用获取的文件在指定位置不存在(即 http://localhost/rss/rssnews.inc.php )。

您正在使用相对路径，它会在同一文件夹中搜索“rssnews.inc.php”。要转到父目录，请使用 ../.

或者使用绝对路径，如http://localhost/rss/rssnews.inc.php。 (替换为 PHP 脚本的绝对路径)

更新

(HTTP 401 解决后)

displayT 函数将 content 作为输入，然后引用未定义的 arr。

假设 content 实际上是一个包含所需格式数据的数组，请将 arr 替换为 content:

function displayT(content){
        var out = "";
        var i;

        for(i = 0; i < content.length; i++) {
            out += '<h4><a href="' + content[i].link+ '">' + 
            content[i].title + '</a></h4><br>';
        }
        document.getElementById('item').innerHTML = out;
    }