Question

我对Java和C ++有基本的了解，但我对Javascript＆amp; HTML。我正在尝试创建5个按钮，这将启动一个小的添加测验。第一个数字是0-12的随机数，但第二个数字是静态的。第二个数字取决于用户的选择。我一直在搜索如何使用单选按钮获取整数。我想找到这个，以便在阵列上实现。任何形式的帮助将不胜感激。

function startAdd(){
  const Add_One = 1;
  var answer;
  var random = new Array();
  for (var i = 0; i < 21; i++){

    random.push(Math.floor(Math.random() * 13));
    console.log(random[i]);

}
//  console.log(Add_One);
//  var x = prompt('Enter something lil boi');
//    var num1 = parseInt(x);
//  console.log(x);


  for(var a = 0;a < 21; a++){

    document.write(random[a] + " + " + Add_One + " =" + "<br>" );

//    if(random[a]+Add_One = answer )

  }

}

<body>
<h1>RicoMath</h1>
<h1 class = "add">Addition</h1>
<h2>Difficulty</h2>
          <div class="options">
            <div>
              <input id="num1" type="radio" name="dif" value="1">
              <label for="num1">1</label>
            </div>
            <div>
              <input id="num2" type="radio" name="dif" value="2">
              <label for="num2">2</label>
            </div>
            <div>
              <input id="num3" type="radio" name="dif" value="3" checked>
              <label for="num3">3</label>
            </div>
            <div>
              <input id="num4" type="radio" name="dif" value="4">
              <label for="num4">4</label>
            </div>
            <div>
              <input id="num5" type="radio" name="dif" value="5">
              <label for="num5">5</label>
            </div>
          </div>

          <button onclick = "startAdd()">Begin!!!!</button>

</body>

Answer 1

正如我在你对你的问题的评论中提到的那样，你根本没有使用过jquery。这是一个基本的例子，说明如何让jquery为你做一些工作：

for (var opts=[],i=1;i<6;i++)  // first: build the radio button menu
  opts.push('<input id="num'+i
            +'" type="radio" name="dif" value="'+i
            +'"><label for="num'+i+'">'+i+'</label>');
$('div.options').html(opts.join('<br>\n'));

$('button').click(function(){  // define the click action
  var dif=$("input[type=radio][name=dif]:checked").val();
  // or: dif=$(".options :checked").val();
  console.log('difficulty from checkbox: '+dif);
  const Add_One = 1;
  var answer, random = new Array();
  for (var i = 0; i < 21; i++){
    random.push(Math.floor(Math.random()*13)+' + '+Add_One+' =');
  }
  $('.questions').html(random.join('<br>\n'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<h1>RicoMath</h1>
<h1 class="add">Addition</h1>
<h2>Difficulty</h2>
<div class="options"></div>
<button>Begin!!!!</button>
<div class="questions"></div>
</body>

我使用dif=$("input[type=radio][name=dif]:checked").val();来获取当前难度值。另一个相同作业的较短选择器也可以是dif=$(".options :checked").val();，因为<div class="options">中只有一组单选按钮。

无论你做什么 - 你都应该不惜一切代价避免使用document.write()，因为它会弄乱你的文档结构。

Answer 2

我不明白你想用这个数字做什么，但是你可以得到它！

<强>的jQuery

var second_digit = $('input[name="dif"]:checked').val();

<强>的javascript

var radios = document.getElementsByName("dif");
var second_digit = null;
for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
        second_digit = radios[i].value;
        //skip other radios as only one can be selected
        break;
    }
}

如果读取值是字符串，则执行

second_digit = second_digit * 1;

或

second_digit = Number(second_digit);

这将转换为数字。

如何将数组与单选按钮

2 个答案: