Question

我在JS编码中编写了最简单的扩展。此扩展程序检查某些用户（某个社交网络）是否在线，然后在通知警报中输出他/她的小图像，姓名和在线状态。它通过（setTimeout）每2分钟检查一次配置文件页面，但是当用户变为“在线”时，我将setTimeout设置为45分钟。（每2分钟避免在线提醒）。

它有效，但不完全符合我的预期。我有两个问题：

1）当某个用户在线并且我更改用户ID（通过选项页面）以检查另一个用户时，它不会发生，因为它等待45分钟或更短的时间。我尝试了以下代码（在options.html中），但它没有帮助。

2）当我更换用户时，图像输出无法正常工作!!它输出以前用户的图像!!

我如何解决这些问题？谢谢！

options.html

<script>

  onload = function() {
  if (localStorage.id){
    document.getElementById("identifier").value = localStorage.id;
  }

  else {
    var el = document.createElement("div");
    el.innerHTML = "Enter ID!!";
    document.getElementsByTagName("body")[0].appendChild(el);

  }

  };

  function onch(){

localStorage.id = document.getElementById("identifier").value;
var bg = chrome.extension.getBackgroundPage();
if(bg.id1){
clearTimeout(bg.id1);
bg.getdata();
}



  }
</script>
<body>
<h1>

</h1>
<form id="options">
<h2>Settings</h2>


    <label><input type='text' id ='identifier' value='' onchange="onch()"> Enter ID </label>
</form>
</body>
</html>

backg.html

<script type="text/javascript">
var domurl = "http://www.xxxxxxxxxxxxxx.xxx/id";


var txt;
var id1;
var id2;
var imgarres = [];
var imgarr = [];
var imgels = [];


function getdata() {
    if (id1){clearTimeout(id1);}
    if (id2){clearTimeout(id2);}

    var url = getUrl();

    var xhr = new XMLHttpRequest();
    xhr.open('GET',url, true);
    xhr.setRequestHeader('Cache-Control', 'no-cache');
    xhr.setRequestHeader('Pragma', 'no-cache');

    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4)  {
        txt = xhr.responseText;
        var r = txt.indexOf('<b class="fl_r">Online</b>');
        var el = document.createElement("div");
        el.innerHTML = txt;
        var n = imgprocess(el,url);     
        var nam = el.getElementsByTagName("title")[0].innerHTML;
            if (r != -1) {
            var notification = webkitNotifications.createNotification(n,  nam, 'online!!' );
            notification.show();
            var id1 = setTimeout(getdata, 60000*45);


            }
           else {

            var id2 = setTimeout(getdata, 60000*2);
           }


    }}

    xhr.send();

}


function imgprocess(text,url){
 imgels = text.getElementsByTagName("IMG");
for (var i=0;i< imgels.length;i++){
 if (imgels[i].src.indexOf(parse(url)) != -1){
    imgarr.push(imgels[i]);


 }


}
for (var p=0; p< imgarr.length; p++){
 if (imgarr[p].parentNode.nodeName=="A"){
  imgarres.push(imgarr[p]);


}
} 
var z = imgarres[0].src;

return z; 
}

function getUrl(){
if (localStorage.id){
var ur = domurl + localStorage.id;
return ur;  
}
else {
var notif = webkitNotifications.createNotification(null, 'blah,blah,blah', 'Enter ID in options!!' );
notif.show();   
getdata();
}
}


function init() {

 getdata();


}
</script>
</head>
<body onload="init();">

</body>
</html>

Answer 1

在选项中而不是clearTimeout(bg.id1);尝试bg.clearTimeout(bg.id1);

对于图像问题，您似乎永远不会清除imgarres数组，只会向其添加元素，然后选择第一个。

PS。您的代码很难阅读，也许如果您使格式良好并且没有使用神秘的变量名称，您将能够更容易地找到错误。

<强>更新

我想我知道问题所在。当您设置超时时，由于var关键字，您使用的是本地范围变量，因此id1仅在此函数内可见，而全局id1仍为undefined。所以而不是：

var id1 = setTimeout(getdata, 60000*45);

尝试：

id1 = setTimeout(getdata, 60000*45);

由于这个if(bg.id1){}内部选项永远不会被执行。

（bg.clearTimeout(bg.id1);应该在那之后工作，但不需要它，因为你正在清除getdata()内的超时

我该如何解决这些问题？

1 个答案: