Форум

maplol123@gmail.com · #1 (**permalink**) 22.08.2020, 01:35

Вот у меня есть какой-то список вопросов, с правильными вариантами ответов (correct)

[
  {
    "question": "123",
    "answers": [
      "1231",
      "1231",
      "123",
      "124"
    ],
    "correct": [2]
  },
  {
    "question": "124214",
    "answers": [
      "12312",
      "12321",
      "123213"
    ],
    "correct": [1]
  },
  {
    "question": "2152",
    "answers": [
      "12512",
      "125215",
      "121421",
      "124124"
    ],
    "correct": [1, 2, 4]
  },
  {
    "question": "12412521",
    "answers": [
      "15125125",
      "125125",
      "125125"
    ],
    "correct": [1, 2, 3]
  }
]

Я беру этот .json файл из сервера. Проверяю айди чекбокса по номеру из correct

let inp;
let answered = document.getElementById("answered");
let allque = document.getElementById("allque");
answered.value = 0;
////взятие файла с сервера
function checkright() {
  fetch("http://localhost:3000/public/data.json")
    .then((response) => {
      return response.json();
    })
////сама проверка чекбоксов
    .then((data) => {
      for (let i = 0; i < data.length; i++) {
        for (let j = 0; j < data[i].question.length; j++) {
          inp = document.getElementById(i + "_" + j);
          if (inp && inp.checked) {
            if (j + 1 == data[i].correct[j]) {
              answered.value++;
            } else {
              answered.value = 0;
            }
          }
        }
      }
      console.log(answered.value);
    });
}

В итоге, у меня на некоторых ответах, которые начинаются не с 1, неправильно проверяет и выводит результат = 0. Как сделать правильную проверку, и там, где более 2х вариантов правильных, засчитывало один балл?

maplol123@gmail.com · #2 (**permalink**) 22.08.2020, 01:39

тут немного другие вопросы, так как сгенерировались рандомно

<body>
  <div>
    <h3>124214</h3>
    <input type="checkbox" id="0_0">12412<br>
    <input type="checkbox" id="0_1">12412<br>
    <input type="checkbox" id="0_2">1214<br>
    <input type="checkbox" id="0_3">12421<br>
    <hr>
</div>
<div>
    <h3>124214</h3>
    <input type="checkbox" id="1_0">12412<br>
    <input type="checkbox" id="1_1">124214<br>
    <input type="checkbox" id="1_2">124214<br>
    <hr>
</div>
<div>
    <h3>12421421</h3>
    <input type="checkbox" id="2_0">12421421<br>
    <input type="checkbox" id="2_1">1242141<br>
    <input type="checkbox" id="2_2">1242141<br>
    <input type="checkbox" id="2_3">112312<br>
    <hr>
</div>
<div>
    <h3>124124</h3>
    <input type="checkbox" id="3_0">124124124<br>
    <input type="checkbox" id="3_1">12412421<br>
    <input type="checkbox" id="3_2">1124214<br>
    <input type="checkbox" id="3_3">12412421<br>
    <hr>
</div>
<button onclick=" checkright()">Ответить</button>
<p>Отвечено: <output id="answered">0</output> /
    <output id="allque">из </output>
</p>

<script type="text/javascript" src="js/app.js"></script>

</body>

рони · #3 (**permalink**) 22.08.2020, 16:33

maplol123@gmail.com,

let inp;
let answered = document.getElementById("answered");
let allque = document.getElementById("allque");
answered.value = 0;
////взятие файла с сервера
function checkright() {
  fetch("http://localhost:3000/public/data.json")
    .then((response) => {
      return response.json();
    })
////сама проверка чекбоксов
    .then((data) => {
      inp = Array.from(document.querySelectorAll("div"),
      div => Array.from(div.querySelectorAll('[type="checkbox"]'),
      ({checked}, i) => checked ? ++i : 0)
      .filter(a => a));
      answered.value = data.filter(({correct}, i) => JSON.stringify(correct) === JSON.stringify(inp[i])).length
      allque.value = `из ${data.length}`;
      console.log(answered.value);
    });
}

maplol123@gmail.com · #4 (**permalink**) 22.08.2020, 22:35

рони, спасибо огромное!

maplol123@gmail.com · #5 (**permalink**) 23.08.2020, 00:48

рони,
и, извините за наглость, можете ли написать, чтоб как-то div с неправильным ответом выделялся, например, backgroundColor: red?

рони · #6 (**permalink**) 23.08.2020, 01:04

maplol123@gmail.com,

let inp;
let answered = document.getElementById("answered");
let allque = document.getElementById("allque");
answered.value = 0;
////взятие файла с сервера
function checkright() {
  fetch("http://localhost:3000/public/data.json")
    .then((response) => {
      return response.json();
    })
////сама проверка чекбоксов
    .then((data) => {
      const divs = document.querySelectorAll("div");
      inp = Array.from(divs,
      div => Array.from(div.querySelectorAll('[type="checkbox"]'),
      ({checked}, i) => checked ? ++i : 0)
      .filter(a => a));
      answered.value = data.filter(({correct}, i) => JSON.stringify(correct) === JSON.stringify(inp[i]) || divs[i].classList.add('red')).length
      allque.value = `из ${data.length}`;
      console.log(answered.value);
    });
}

maplol123@gmail.com · #7 (**permalink**) 23.08.2020, 19:28

рони,
Большое спасибо!

Форум

Справочник

Discord чат

Курсы javascript