Таблица JavaScript для неправильного значения флажка цикла - PullRequest
0 голосов
/ 24 июня 2019

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

Это ссылка на действующую страницу в действии. Это код, который необходимо исправить.

https://musing -jang-0e572c.netlify.com / senate-data.html -> PAGE

https://github.com/Makkoyev/ubiqum-task2/blob/master/assets/js/manipulation.js -> Раздел флажков GitHub

Это код:

(function () {
if (currentURL.indexOf("senate-data.html") == true) {
    getSenate();
    cbs = document.querySelectorAll("input[type=checkbox]");
    targets = document.querySelectorAll("#table tr td:nth-child(2)");
    tr = document.querySelectorAll("#table tr");
    for (i = 0; i < cbs.length; i++) {
        cbs[i].addEventListener('change', function () {
            if (this.checked) {
                // Checkbox is checked..
                console.log("Checkbox checked!", this.value);
                for(i = 0; i < targets.length; i++){
                    if(this.value == targets[i].innerHTML){
                        console.log("Uguale", targets[i]);
                        targets[i].parentNode.classList.add("hide-row");
                    }
                }
            } else {
                // Checkbox is not checked..
                console.log("Checkbox unchecked!", this.value)
            }
        });
    }
}
if (currentURL.indexOf("house-data.html") == true) {
    getHouse();
}
* * 1016}) ();

1 Ответ

0 голосов
/ 24 июня 2019

Вы, вероятно, хотите что-то вроде этого

FIDDLE

window.addEventListener("load", function() { // on page load
  [...document.querySelectorAll("input[type=checkbox]")].forEach(function(cbs) { // take all checkboxes 
    cbs.addEventListener('change', function() { // when they change
      var vals = [...document.querySelectorAll(".filters input[type=checkbox]:checked")].map(chk => chk.value); // get all checked values
      [...document.querySelectorAll("#table tr td:nth-child(2)")].forEach(function(target) { // for all cell 2
        target.parentNode.classList.toggle("hide-row",
          vals.indexOf(target.textContent) == -1); // hide the ones NOT in the above list
      });
    });
  });
})
...