隨機數組更新

Question

我有一個數組，其中兩個值以隨機順序進行比較。 我如何更新值？ 幫助，如果不難。

 $(document).ready(function() { var myArray = [{ "q1": "a", "an": "a" }, { "q1": "b", "an": "b" }, { "q1": "c", "an": "c" }]; var rand = Math.floor(Math.random() * myArray.length); $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>"); $("#btn").click(function() { var answer = $("#answer").val(); if (answer == myArray[rand].an) { $("#comment").html("<div>" + "OK!" + "</div>"); } else { $("#comment").html("<div>" + "NO!" + "</div>"); } $("#answer").val(''); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="wrap"> <div id="question"></div> <input id="answer" /> <div id="comment"></div> <button id="btn">Button</button> </div>

Answer 1

<div id="wrap">
    <div id="question"></div>
    <input id="answer" />
    <div id="comment"></div>
    <button id="btn">Button</button>
    <button id="next">Next</button>
  </div>

JS

$(document).ready(function() {
    var myArray = [{
      "q1": "a",
      "an": "a"
    }, {
      "q1": "b",
      "an": "b"
    }, {
      "q1": "c",
      "an": "c"
    }];
    var rand = Math.floor(Math.random() * myArray.length);
    $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>");
    $("#btn").click(function() {
      var answer = $("#answer").val();
      if (answer == myArray[rand].an) {
        $("#comment").html("<div>" + "OK!" + "</div>");
      } else {
        $("#comment").html("<div>" + "NO!" + "</div>");
      }
      $("#answer").val('');
    });
  $("#next").click(function(){

   var newRand =rand;
   while(rand==newRand)
   {
     newRand = Math.floor(Math.random() * myArray.length);
   }
rand =newRand;
    $("#question").html("<div id='text'>" + myArray[newRand].q1 + "</div>");
  });
});

這是小提琴https://jsfiddle.net/eax8cvwn/

Answer 2

您可以像這樣訪問數組值：

myArray[0].an = 'new value';

其中0是數組中的“行”。

Answer 3

單擊按鈕后，您需要重置隨機值。 所以把下面的線放在按鈕點擊內。

rand = Math.floor(Math.random() * myArray.length);
$("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>");

 $(document).ready(function() { var myArray = [{ "q1": "a", "an": "a" }, { "q1": "b", "an": "b" }, { "q1": "c", "an": "c" }, { "q1": "d", "an": "d" }, { "q1": "e", "an": "e" }]; var rand = Math.floor(Math.random() * myArray.length); $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>"); $("#btn").click(function() { var answer = $("#answer").val(); if (answer == myArray[rand].an) { $("#comment").html("<div>" + "OK!" + "</div>"); } else { $("#comment").html("<div>" + "NO!" + "</div>"); } $("#answer").val(''); rand = Math.floor(Math.random() * myArray.length); $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>"); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="wrap"> <div id="question"></div> <input id="answer" /> <div id="comment"></div> <button id="btn">Button</button> </div>

Answer 4

將新生成的隨機數推入數組並使用indexOf檢查它是否存在並生成新的隨機數。 並檢查是否使用問題的數組長度和隨機數數組長度回答了所有問題並完成測驗。

像這樣嘗試

 $(document).ready(function() { var myArray = [{ "q1": "a", "an": "a" }, { "q1": "b", "an": "b" }, { "q1": "c", "an": "c" }]; var rand = Math.floor(Math.random() * myArray.length); $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>"); var askedQtn = []; askedQtn.push(rand); $("#btn").click(function() { var answer = $("#answer").val(); if (answer == myArray[rand].an) { $("#comment").html("<div>" + "OK!" + "</div>"); } else { $("#comment").html("<div>" + "NO!" + "</div>"); } $("#answer").val(''); var newRand =rand; if(myArray.length <= askedQtn.length){ $("#wrap").html("<div id='text'>Questions Over</div>"); } else { while(askedQtn.indexOf(rand) >= 0) { rand = Math.floor(Math.random() * myArray.length); } askedQtn.push(rand); $("#question").html("<div id='text'>" + myArray[rand].q1 + "</div>"); } }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="wrap"> <div id="question"></div> <input id="answer" /> <div id="comment"></div> <button id="btn">Button</button> </div>