随机为Button分配值

时间:2014-03-10 08:04:58

标签: jquery random

我有一个随机变量,可以选择1-10之间的任意随机数。我想创建一个问题,用户必须猜测生成的随机数。我想给用户4个选项。

我有4个不同的变量abcrand

function generateOption()
{

var rand = Math.floor((Math.random() * 9)+1);
    var arr = [];
    var n,a,b,c;
    for(var i=0; i<3; i++)
    {
        do{
            n = Math.floor(Math.random()*9+1);
            }
        while(arr.indexOf(n) !== -1&&n!=rand);

       arr[i] = n;
    //  alert(arr[i]); 
    }

    a=arr[0];
    b=arr[1];
    c=arr[2];
alert(a+" "+b+" "+c+" "+rand);


}

我有四个这样的按钮

<table style="  margin: 0 auto;">
   <tr>
   <td><input id="nextbutton3" type="button" class="finish"></td><td></td><td><input id="nextbutton4" type="button" class="finish"></td>
   </tr>
   <tr>
   <td><input id="nextbutton5" type="button" class="finish"></td><td></td><td><input id="nextbutton6" type="button" class="finish"></td>
   </tr>
   </table>

我可以为这样的按钮指定值

$(function() {
        $("#nextbutton3").val(a);
        $("#nextbutton4").val(b);
        $("#nextbutton5").val(c);
        $("#nextbutton6").val(rand);
    });

但这将始终为button6设置正确答案。

如何随机为按钮分配值abcrand?请帮忙

2 个答案:

答案 0 :(得分:1)

您可以将所有4个值放在一个数组中,并在数组中随机化它们的顺序,然后将它们分配给按钮。

Randomizing elements in an array?

答案 1 :(得分:1)

您的作业也需要是随机的。我将建议一个不同的工作流程:

function generateOptions() {
  var randomValues = [];
  var currentValue;

  // First, generate 4 random values in the 1-10 range
  while(randomValues.length < 4) {
    currentValue = Math.floor(Math.random() * 9) + 1;

    // Avoid duplicates
    if(randomValues.indexOf(currentValue) < 0) {
      randomValues.push(currentValue);
    }
  }

  // Here, randomValues has 4 values
  // We then pick one to be the "right" one:

  var correctValue = randomValues[Math.floor(Math.random() * 4)];

  return {
    options: randomValues,
    correct: correctValue,
  };
}

然后,准备页面:

$(function() {
  var setup = generateOptions();

  // Assign each of the values to a button
  $("#nextbutton3").val(setup.options[0]);
  $("#nextbutton4").val(setup.options[1]);
  $("#nextbutton5").val(setup.options[2]);
  $("#nextbutton6").val(setup.options[3]);

  // That's the selector I've deduced from your markup. Feel free to change it
  $("input.finish").on("click", function() {
    // We need to parse the .val() as int, since it returns a string
    var selectedValue = parseInt($(this).val(), 10);

    if(selectedValue === setup.correct) {
      alert("Correct!");
    } else {
      alert("Wrong!");
    }
  });
});

一个简单的工作示例:http://jsbin.com/moyuqaha/1/edit?html,js,output(按住ctrl + enter,同时专注于js窗口重新加载数字)