Question

<!doctype html>
<html>

<head>
    <title>Twitter</title>
    <meta charset="utf-8">
    <script>
        window.onload = function () {
            // set up the click handler for the form button
            var button = document.getElementById("submit");
            button.onclick = getTweets;
        }
         // when you click "Get Tweets" we call this function
        function getTweets() {
            // set up a new XHR request
            var xhr = new XMLHttpRequest();
            // we're calling search.php and passing in a query string
            var url = "search.php?query=";
            var query = document.getElementById("query").value;
            if (!query) {
                query = "html5";
            }
            // we encode the query to handle any special characters properly
            url += encodeURIComponent(query);

            // this is the function that is called when the XHR request
            // to our search.php script is handled, and a response sent back
            xhr.onload = function () {
                // if everything went okay, then send the response data
                // to the displayTweets() function
                if (xhr.status == 200) {
                    displayTweets(xhr.responseText);
                } else {
                    var errorDiv = document.getElementById("error");
                    errorDiv.innerHTML = "Error getting tweets: " + xhr.status;
                }
            };
            // make the request!
            xhr.open("GET", url);
            xhr.send(null);
        }

        function displayTweets(tweets) {
            // tweets is a big long string, so we need to parse it 
            // into JSON first
            tweets = JSON.parse(tweets);
            var ul = document.querySelector("ul");
            // clear existing tweets from list
            while (ul.hasChildNodes()) {
                ul.removeChild(ul.lastChild);
            }
            // add new tweets
            for (var i = 0; i < tweets.length; i++) {
                var li = document.createElement("li");
                li.innerHTML = tweets[i].tweet;
                ul.appendChild(li);
            }
        }
    </script>
</head>

<body>
    <form>
        Query:
        <input type="text" id="query">
        <input type="button" id="submit" value="Get Tweets">
    </form>
    <div id="error"></div>
    <ul></ul>
</body>

</html>

在上面的代码中，当我在文本框中输入一些文本并单击“获取推文”按钮时，它会给出Error getting tweets: 0错误。 search.php独立执行而不嵌入html和javascript时会给出准确和必需的结果。请你检查一下html和js代码并建议代码中的任何变化吗？

Answer 1

似乎问题是CROSS-DOMAIN Ajax问题。当您独立执行search.php时，就没有X域问题。但是当您将代码嵌入到某些html中时，请检查html是否属于同一个域。此外，如果您尝试从file：///运行html文件，它将无法正常工作。

从twitter中提取推文时出错

1 个答案: