javascript - setInterval 变量不可访问

Question

var cnt1 = 0;
function initOctoView(){
   var newcnt1 = printAdsBox1(cnt1, imgPerBox1); // first time on first load
   var totalBoxes8 = setInterval(function() {
      newcnt1 = printAdsBox1(newcnt1, imgPerBox1); // all 5 sec
   }, 5000);
}

这个函数被这个调用：

if($('.octoView').length > 0){
    initOctoView();
}

到目前为止工作正常。

后来我有：

$(document).on('click', 'a.windowXL', function () {
   window.clearInterval(totalBoxes8);
}

但这会返回未定义 totalBoxes8 。我的错误是什么？请指教！

Answer 1

您在函数内部使用 var 声明 totalBoxes8 - totalBoxes8 是仅可在此函数中访问的局部变量。你可以让它全球化：

var cnt1 = 0;
var totalBoxes8;
function initOctoView(){
     var newcnt1 = printAdsBox1(cnt1, imgPerBox1); // first time on first load
     totalBoxes8 = setInterval(function() {
          newcnt1 = printAdsBox1(newcnt1, imgPerBox1); // all 5 sec
      }, 5000);
}

Answer 2

尝试这个;

$(function(){

    var cnt1 = 0, totalBoxes8 ;
    function initOctoView(){
       var newcnt1 = printAdsBox1(cnt1, imgPerBox1); // first time on first load
       totalBoxes8 = setInterval(function() {
          newcnt1 = printAdsBox1(newcnt1, imgPerBox1); // all 5 sec
       }, 5000);
    }

   $(document).on('click', 'a.windowXL', function () {
      window.clearInterval(totalBoxes8);
   }
});

Answer 3

totalBoxes8是undefined因为它是在函数范围内本地initCotoView()声明的，因此对全局范围不可用

您可以通过将其显式附加到全局对象来从函数内window声明一个全局对象。就像是：

function foo() {
  window.myVar = 1; // declares a global
} 

foo(); // call the function to actually make the declaration

console.log(window.myVar); // the variable is accessible globally