Блог

Я слушаю изменения в двух переменных height и weight . Когда оба оцениваются как true, я ожидал, что возвращаемое значение false остановит прослушиватель. Он продолжает добавляться <script type="text/javascript" src="js/modelers/average_aboveaverage.js"></script> , когда я перемещаю ползунок диапазона в другом месте моего кода.

   function makeModeler() {
    document.addEventListener("change", function(){
      var height = document.getElementById('height-class').value; 
      var weight = document.getElementById('weight-class').value;
      shape = height   "_"   weight;
     
      if (!(height amp;amp; weight)) { 
        return true;

      } else {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "js/modelers/" shape ".js";

        document.body.appendChild(script);
        return false;        
      }
    });  
   
  }

  makeModeler();

  document.addEventListener("change", makeModeler);
  document.removeEventListener("change", makeModeler, false);
  

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

 document.addEventListener("change", makeModeler);
  

И makeModeler функция также добавляет сначала это onChange событие

Мне пришлось найти нетрадиционный способ остановить EventListener. EventTarget не сработал для меня из-за «динамического» способа рендеринга данных на моем сайте. В качестве примечания, addEventListener должен поставляться с возможностью остановить его бесконечный запуск. Кажется очевидным.

Я добавил слушателя в do / while:

   var height = document.getElementById('height-class').value; 
  var weight = document.getElementById('weight-class').value;
  
  do {
    document.addEventListener("change", function(){
      
      var height = document.getElementById('height-class').value; 
      var weight = document.getElementById('weight-class').value;

      shape = height   "_"   weight;
     
      if (!(height amp;amp; weight)) { 
        return true;      

      } else {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "js/modelers/" shape ".js";

        document.body.appendChild(script);
        document.getElementById('weight-class').id = "weight-class2";
        
      }
      
    });  
  }
  while (height amp;amp; weight);
  

Я изменил идентификатор элемента, чтобы остановить вычисление условия while на true. Более опытный программист может знать, как лучше остановить условие.