recursive clearInterval не работает

Question

У меня есть следующая функция в javaScript. Эта функция вызывается, когда я обнаруживаю необходимость повторной загрузки таблицы стилей. например, до изменения пользовательского языка, поэтому текст больше не будет соответствовать кнопкам. Проблема в том, что она застревает в части setInterval. зацикливаясь на ней бесконечно. Я вижу в хром-отладчике, что он добирается до части clearInterval, но он не очищается. Эта функция - resetStyle - вызывается только один раз.

p.resetStyle = function() { 
    var that = this; 
    var oldStylesheet_href = $('#mainStylesheet').attr("href"); 
    var i = oldStylesheet_href.indexOf('lang'); 
    var lastLanguege = oldStylesheet_href.substring(i + 5, i + 7); 
    var prefix, sufix; 

    if (lastLanguege === createjs.mainManager.LangString) { 
     return; 
    } 

    prefix = oldStylesheet_href.substring(0, i - 1); 
    sufix = '&' + oldStylesheet_href.substring(i + 7, oldStylesheet_href.length); 


    var head = document.getElementsByTagName('head')[0]; // reference to document.head for appending/ removing link nodes 
    var link = document.createElement('link');   // create the link node 
    link.setAttribute('id', 'newStylesheet'); 
    link.setAttribute('href', prefix + '&lang=' + createjs.mainManager.LangString + sufix); 
    link.setAttribute('rel', 'stylesheet'); 
    link.setAttribute('type', 'text/css'); 

    var sheet, cssRules; 
    // get the correct properties to check for depending on the browser 
    if ('sheet' in link) { 
     sheet = 'sheet'; 
     cssRules = 'cssRules'; 
    } 
    else { 
     sheet = 'styleSheet'; 
     cssRules = 'rules'; 
    } 

    var timeout_id = setInterval(function() {      // start checking whether the style sheet has successfully loaded 
     try { 
      if (link[sheet] && link[sheet][cssRules].length) { // SUCCESS! our style sheet has loaded 
       clearInterval(timeout_id);      // clear the counters 
       clearTimeout(timeout_id); 
       that.onStyleReset(); 
      } 
     } catch (e) { 
     } finally { 
     } 
    }, 10), // how often to check if the stylesheet is loaded 
      timeout_id = setTimeout(function() {  // start counting down till fail 
     clearInterval(timeout_id);    // clear the counters 
     clearTimeout(timeout_id); 
     head.removeChild(link);    // since the style sheet didn't load, remove the link node from the DOM 
     that.onStyleReset(); 
    }, 15000); 

    $('head').append(link); 
    $('#mainStylesheet').remove(); 
    link.setAttribute('id', 'mainStylesheet'); 
}; 

Answer 1

Возможно ли, что вы запускаете таймер более одного раза? Не могли бы вы попытаться:

var timeout_id = (function() { 
    if (timeout_id) { 
     // a timer is already running! 
     clearInterval(timeout_id);  // stop it - or you could just return and not create a new one 
    } 
    return setInterval(function() { 
      if (link[sheet] && link[sheet][cssRules].length) { 
       clearInterval(timeout_id);     
       that.onStyleReset(); 
      } 
     }, 10) 
    })();