Блог

Главная - Вопросы по программированию - Как рандомизировать позицию для моего ввода с помощью JS?

Как рандомизировать позицию для моего ввода с помощью JS?

#javascript

Вопрос:

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

 const vintecinco = document.getElementById('312');
const vinteseis = document.getElementById('314');
const vintesete = document.getElementById('214');

vinteseis.addEventListener('click', acerto);

function acerto() {
  var msg = document.createElement('p');
  msg.textContent = 'Voce acertou!';
  msg.style.cssText = 'color: green;'
  document.body.appendChild(msg);
  var prosseguir = document.createElement('a');
  prosseguir.textContent = 'Próxima pergunta!'
  prosseguir.href = 'q3.html';
  document.body.appendChild(prosseguir);
  vintecinco.disabled = true;
  vinteseis.disabled = true;
  vintesete.disabled = true;
}

vintecinco.addEventListener('click', erro);

vintesete.addEventListener('click', erro);

function erro() {
  var msgerro = document.createElement('p');
  msgerro.textContent = "Voce errou!";
  msgerro.style.cssText = 'color: red;';
  document.body.appendChild(msgerro);
  var voltar = document.createElement('a');
  voltar.textContent = 'Recomeçar!'
  voltar.href = 'index.html';
  document.body.appendChild(voltar);
  vintecinco.disabled = true;
  vinteseis.disabled = true;
  vintesete.disabled = true;
} 
 <main>
  <p>Qual o número de pi?</p>
  <input type="submit" value="3,12..." id='312'>
  <input type="submit" value="2,14..." id='214'>
  <input type="submit" value="3,14..." id='314'>
</main>

Что я мог бы сделать, чтобы получить случайные позиции, не ставя под угрозу мой правильный ответ?

Теперь я внес некоторые изменения и создал тестовый файл. Я пытаюсь сделать что-то подобное, но теперь я не могу изменить значение 2 неправильных ответов, они по умолчанию. Как я мог это изменить?

 var random = Math.floor(Math.random() * 3);

for(var i=1;i<=10;i  ) {
console.log(i);
var button = document.getElementById('btn'   i);
if(random == i) {
        button.addEventListener('click', prize);
        button.value = '1';
}
else {
        button.addEventListener('click', closewindow);
        button.value = '2';
}
}

Комментарии:

1. Я не вижу попытки сделать то, о чем вы здесь просите. Либо создайте узлы, либо значения в случайном порядке из массива, используя yourArray[Math.floor(Math.random()*3)] .

2. value Вместо этого рандомизируйте буквы s. Вам нужно будет отследить, какой идентификатор содержит правильный ответ.

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

Ответ №1:

Есть много способов сделать то, что вы хотите, в зависимости от остальной части приложения, один или другой может быть лучше для вас, например:

     var input = [];

function acerto() {
  var msg = document.createElement('p');
  msg.textContent = 'Voce acertou!';
  msg.style.cssText = 'color: green;'
  document.body.appendChild(msg);
  var prosseguir = document.createElement('a');
  prosseguir.textContent = 'Próxima pergunta!'
  prosseguir.href = 'q3.html';
  document.body.appendChild(prosseguir);

  input.forEach((i)=>{
    i.disabled = true;
  });
  input = [];
}

function erro() {
  var msgerro = document.createElement('p');
  msgerro.textContent = "Voce errou!";
  msgerro.style.cssText = 'color: red;';
  document.body.appendChild(msgerro);
  var voltar = document.createElement('a');
  voltar.textContent = 'Recomeçar!'
  voltar.href = 'index.html';
  document.body.appendChild(voltar);

  input.forEach((i)=>{
    i.disabled = true;
  });
  input = [];
}

  // question, true, false, false...
  var res = ["Qual o número de pi?", "3.14", "2.14", "3.12"];
  var quest = document.getElementsByTagName("main")[0];

  // Create Question
  quest.innerHTML = "<p>"   res.splice(0, 1)[0]   "</p>";

  // Create Random input
  for(i in res){
    let temp = document.createElement('input');
    temp.type = "submit";
    temp.value = res[i];
    if(i == 0){
      temp.addEventListener('click', acerto);
    }else{
      temp.addEventListener('click', erro);
    }

    let rand = Math.floor((input.length 1) * Math.random());
    input.splice(rand, 0, temp);
  }

  // Show input
  input.forEach((i)=>{
    quest.appendChild(i);
  }); 
 <main>
</main>
Метки: