多个ajax请求过了一段时间不起作用


Multiple ajax requests not working after a while

我有一个页面,它连续(每秒)从服务器加载实时股票数据,向名为data.php的php文件发出请求。我还有一个Ganns平方9计算器,它使用ajax通过文本框的OnKeyUp函数将值传递给php文件(getdata.php),并返回一些输出。

问题是-当页面加载时,两者都能完美工作。可以使用实时数据和计算器。但过了一段时间,计算器就不工作了。在将值写入文本框时,必须处理请求,并且必须通过ajax调用返回值,但这并没有发生。

实时股票数据代码(每秒刷新一次):

<script>
            function showPort(t)
            {
            var xmlhttp=new XMLHttpRequest();
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("portfo").innerHTML=xmlhttp.responseText;
                }
              }
            xmlhttp.open("GET","data.php",true);
            xmlhttp.send();
            setTimeout(showPort,t);
            }
          </script>

它使用页面加载-运行

<body onload="JavaScript:showPort(2000);">

Ganns平方计算器代码,在文本框的keyup事件上运行:

<script>
            function showData(str)
            {
            if (str.length==0)
              {
              document.getElementById("txtData").innerHTML="";
              return;
              }
            var xmlhttp=new XMLHttpRequest();
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("txtData").innerHTML=xmlhttp.responseText;
                }
              }
            xmlhttp.open("GET","getdata.php?a="+str,false);
            xmlhttp.send();
            }
          </script>

在文本框的KeyUp事件上运行-

<input type="text" placeholder="Last traded Price" name="str" onKeyUp="showData(this.value)">

我试着搜索类似的问题,但没有得到答案。因此,将此问题作为一个新问题发布在此处。

第一个脚本:

function showPort(t)
{
    var xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("portfo").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","data.php",true);
    xmlhttp.send();
    setTimeout(showPort,t);
}

可以这样转换:

$(document).ready(function(){
    setInterval(function(){
        $.get("data.php", function(data){
            $("#portfo").html(data);
        });
    }, 2000);
});

下一个:

function showData(str)
{
    if (str.length==0)
    {
        document.getElementById("txtData").innerHTML="";
        return;
    }
    var xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("txtData").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getdata.php?a="+str,false);
    xmlhttp.send();
}

可以重写为:

function showData(str)
{
    if (str.length==0)
    {
        $("#txtData").html("");
        return;
    }
    $.get("getdata.php?a="+str, function(data){
        $("#txtData").html(data);
    });
}

你能试着执行上面的代码,看看它是否有效吗?不要忘记以这种方式包含jQuery:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">