javascript - AJAX xmlhttprequest 弹出窗口

Question

基本上，我想做的是在页面的一 Angular 有一个淡入/淡出弹出窗口。例如John Doe 刚刚上线。我正在使用 AJAX 检查最新更新，如果是新的，则显示弹出窗口。

显示弹出窗口的函数(使用jquery)是:

function hidepop(){
  $("#popup").fadeOut("slow");
}

function showpop(){
  $("#popup").fadeIn("slow");
  setTimeout("hidepop()",4000);
}

如有必要，更新并显示弹出窗口的代码是:

function getHTTPObject(){
  if (window.ActiveXObject) return new ActiveXObject("Microsoft.XMLHTTP");
  else if (window.XMLHttpRequest) return new XMLHttpRequest();
  else {
    alert("Your browser does not support AJAX. Please download Google Chrome or Firefox.");
    return null;
  }
} 


function checkUpdates(old){
  httpObject = getHTTPObject();
  var randomnumber=Math.floor(Math.random()*10000);
  if (httpObject != null) {
    link = "updates.php?rnd="+randomnumber;
    httpObject.open("GET", link , true);
    httpObject.onreadystatechange = function() {
      if(httpObject.readyState == 4){
        var response = httpObject.responseText;
        var objDiv = document.getElementById("popup");
        objDiv.innerHTML = response;
        if(response == old){
          var time = setTimeout(function(){checkUpdates(response); response = null},5000);
        }else{
          var objDiv = document.getElementById("popup");
          objDiv.innerHTML = response;
          showpop();
          var time = setTimeout(function(){checkUpdates(response); response = null},5000);
        }
      }
    }
  }
}

然后，开始一切:

onload="checkUpdates('');" 

在正文标签上。

所以，我的问题是......什么也没发生。我知道显示弹出窗口是有效的，因为如果我调用 showpop() 它就会显示。

这可能是一些愚蠢的错误，但是，您能给我一些关于问题可能是什么以及如何解决它的想法/指示吗？

非常感谢，卡勒姆。

Answer 1

我首先使用 jquery 的 ' get ' 方法，因为你似乎已经在使用 jquery 了。

var old = '';
function checkUpdates() {
    var randomnumber = Math.floor(Math.random() * 10000);
    link = "updates.php?rnd=" + randomnumber;
    $.get(link, function(data) {
        /* called when the resource was successfully retrieved */
        if (old != data) {
            $('#popup').html(data); // set the new data in the popup element
            showpop();              // show the popup
            old = data;             // store the retrieved data
        }
        setTimeout(checkUpdates, 5000);
    });
}

您的 showpop 和 hidepop 函数并未真正正确定义。
也许你可以阅读document.ready(...) .

这应该可以解决问题(请注意，使用 jquery 的 delay 函数，您可以很好地链接所有内容:

function hidepop(){
    $("#popup").fadeOut("slow");
}

function showpop(){
    $("#popup").fadeIn("slow");
    setTimeout(function() {hidepop();}, 4000);
}