1

我的 html 表单上的输入有问题。目前，我正在将 twitter 名称的输入输入到 Ajax 函数中，该函数通过 php 从 twitter api 调用推文。因为我有一个 setInterval 函数来不断检查更新，所以输入会一次又一次地传递到函数中以获取推文。

问题是该函数似乎是直接从文本输入框中的内容读取输入。因此，如果用户在没有按 Enter 或点击按钮的情况下更改文本，该函数会继续读取该文本作为输入。所以最初输入的输入在按下回车或点击按钮提交后并不固定。

这是接受输入的html表单：

<div id="topdiv">Input Twitter ID: <input type="text" id="userid"    onkeydown="if(event.keyCode===13) {document.getElementById('tweet-button').click();}">  
<input type="submit" id="tweet-button" onclick="getStatusesX();" value="Get recent tweets">   
<p id="tweetbox"></p>
</div>

以下是功能：

function getStatusesX() {

   var userID = document.getElementById("userid").value;
   getStatuses(userID);
   var intervalstop = setInterval(function() {getStatuses(userID);}, 20000);
   clearInterval(intervalstop);}

//Create a cross-browser XMLHttp Request object
function getXMLHttp() {

    var xmlhttp;
    if (window.ActiveXObject) {
        XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } else if (window.XMLHttpRequest) {
       XMLHttp = new XMLHttpRequest();
    } else {
        alert("Your browser does not support XMLHTTP!");
    }
    return XMLHttp;
}

//function that searches for the tweets  via php
function getStatuses(userID){

XMLHttp1 = getXMLHttp();

    //ajax call to a php file that will extract the tweets
    XMLHttp1.open( 'GET', 'TwitterGlimpsePHP.php?userid='userID, true);

    // Process the data when the ajax object changes its state
    XMLHttp1.onreadystatechange = function() {
        if( XMLHttp1.readyState == 4 ) {
            if( XMLHttp1.status ==200 ) {  //no problem has been detected
                document.getElementById("tweetbox").innerHTML=XMLHttp1.responseText;
            }
        }
    }
    XMLHttp1.send(null);
}

我希望在按下输入后将输入作为文本。我尝试将其分配给变量，但无法弄清楚为什么它一直从输入字段读取。任何帮助表示赞赏。

4

2 回答 2

2

这不是官方答案 - 只是想澄清我的评论

这就是我在函数外部声明的意思......

var intervalstop;

function getStatusesX() {
   clearInterval(intervalstop);

   var userID = document.getElementById("userid").value;
   getStatuses(userID);
   intervalstop = setInterval(function() {getStatuses(userID);}, 20000);

}

这样，您初始化 var 并在函数内部首先清除以确保它不会复合。然后将 var 设置为新的间隔以重新开始。

你说如果用户点击很多次，twitter 不喜欢这个代码的某些东西 - 完全有道理。他们会想要限制 API 以防止有人因编码不当而每分钟发出 50,000 个请求。您应该检查 API 规范以确保您在现实区域内，如果您正在突破界限，请考虑在本地缓存结果。

于 2013-04-11T23:55:54.947 回答
1

问题是您每次调用 getStatuses 时都在重新读取文本框的值。

尝试首先捕获文本框的值，并将其传递给您的 getStatuses 函数：

所以你的新 getStatusesX 是：

function getStatusesX() {
    var userID = document.getElementById("userid").value;
    getStatuses(userID);
    setInterval(function() {
        getStatuses(userID);
    }, 20000);
}

更新 getStatuses 以获取用户 ID 参数并删除您在 getStatuses 中读取文本框值的行。

话虽如此，如果这可能开始可能是一个问题 - 如果用户单击按钮以自动刷新状态多次怎么办？您可能希望在单击按钮/文本框后禁用它，或者先清除旧间隔。

于 2013-04-11T20:57:52.790 回答