Проверьте, существует ли элемент SetInterval в For Loop - PullRequest
Новая
       4

Проверьте, существует ли элемент SetInterval в For Loop

0 голосов
/ 15 апреля 2020

Я пытаюсь проверить, был ли заполнен каждый элемент перед созданием датчика. Значение датчика устанавливается другим API, поэтому приходится ждать, пока значение не будет представлено.

Проверка в For L oop, похоже, не работает 

function refreshGauge() {
var table = document.getElementById("mytab1");
var targetTDs = table.querySelectorAll(".myfindclass2");
for (var i = 0; i < targetTDs.length; i++) {
  var td = targetTDs[i];
  var fvals = td.querySelectorAll("[id*='calcValue']");
  var fval = fvals[0].innerText.replace('%','');
  var checkElem = "#" + fvals[0].getAttribute('id');
  console.log(checkElem)
//HERE Doesn't work 

var checkExist = setInterval(function() {
   if ($(checkElem).length) {
      console.log("Exists!");
         nextstep(td)
      clearInterval(checkExist);
  }
}, 100); // check every 100ms   


  }
 console.log('done')
} ;


    refreshGauge()

Вышеуказанное приводит к бесконечной l oop проверке элемента только на один элемент.

Если я использую приведенное ниже, это работает, но я не могу перечислить все 36+ в списке:

Каков наилучший способ достижения sh, имеющего каждый элемент проверяется, чтобы убедиться, что значения заполнены перед созданием / обновлением датчика. 

function refreshGauge() {
var table = document.getElementById("mytab1");
var targetTDs = table.querySelectorAll(".myfindclass2");
for (var i = 0; i < targetTDs.length; i++) {
  var td = targetTDs[i];
  var fvals = td.querySelectorAll("[id*='calcValue']");
  var fval = fvals[0].innerText.replace('%','');
  var checkElem = "#" + fvals[0].getAttribute('id');
  console.log(checkElem)


nextstep(td)


  }
 console.log('done')
} ;  

  var checkExist = setInterval(function() {
     if ($('gauge1').length && $('gauge2').length && $('gauge3').length  && $('gauge4').length) {
        console.log("Exists!");
         refreshGauge()
        clearInterval(checkExist);
    }
  }, 100); // check every 100ms

После тестирования двух кодов, которые я выучил, я должен оценить, если нужное мне значение все еще не определено или имеет значение. var fval = fvals[0].innerText.replace('%','');

Я пытаюсь что-то вроде этого, но не работает: 

function refreshGauge() {
var table = document.getElementById("mytab1");
var targetTDs = table.querySelectorAll(".myfindclass2");
for (var i = 0; i < targetTDs.length; i++) {
  var td = targetTDs[i];
  var fvals = td.querySelectorAll("[id*='calcValue']");
  var fval = fvals[0].innerText.replace('%','');
  var checkElem = "#" + fvals[0].getAttribute('id');
  console.log(fval )
//HERE Doesn't work 

var checkExist = setInterval(function() {
   if (fval.length) {
      console.log("Exists!");
         nextstep(td)
      clearInterval(checkExist);
  }
}, 100); // check every 100ms   


  }
 console.log('done')
} ;


    refreshGauge()

1 Ответ

1 голос
/ 15 апреля 2020

Похоже, что извлечение функции waitForElement, которая принимает селектор элемента в качестве аргумента и возвращает обещание, разрешающее найденный элемент, может быть весьма полезным.

Вы можете l oop через tds, получить идентификатор селектора и передать его функции waitForElement и .then nextstep

function refreshGauge() {
    const table = document.getElementById("mytab1");
    const targetTDs = table.querySelectorAll(".myfindclass2");
    targetTDs.forEach(td => {
        const td = targetTDs[i];
        const fvals = td.querySelectorAll("[id*='calcValue']");
        const selector = "#" + fvals[0].getAttribute("id");
        waitForElement(selector)
            .then(() => nextstep(td))
    })
}
function waitForElement(selector) {
    return new Promise((resolve) => {
        const checkExist = setInterval(function () {
            const elements = $(selector)
            if (elements.length) {
                clearInterval(checkExist);
                resolve(elements[0]);
            }
        }, 100);
    })
}

Примечание: использование функций стрелок, const и Promise может быть неприемлемым во всех браузерах

...