5个单选按钮随机填充

5 radio buttons fill up randomly?

本文关键字:填充 随机 单选按钮 5个      更新时间:2023-09-26

嗨,正如你所看到的,我正在尝试制作五个按钮,我想要一个函数,当你按下"点击我"时,它会随机填充五个按钮。

它就像一个游戏统计数据的随机生成器。

我不知道我是否做错了,但我想我需要一些其他的编码。

有人能帮我吗?

这就是我所拥有的:

<button onclick='myFunction()'>click me</button>
<div id="demo">
<Input type = radio Name = r1> 
<Input type = radio Name = r2> 
<Input type = radio Name = r3> 
<Input type = radio Name = r4>
<Input type = radio Name = r5> 
</div>

<script type="text/javascript">
    function myFunction() {
    document.getElementById('demo').innerHTML = '';
    var num = 3;
    var noOfButtons = Math.floor(Math.random() * num);
    console.log(noOfButtons);
    for (var i = 0; i < noOfButtons; i++) {
    var box = document.createElement();
        document.getElementById('demo');
        }
    }
</script>

不确定您在寻找什么。我把这个JSFiddle扔在一起了。看看这是不是你想要的。

<button id='button1'>click me</button>
<div id="demo">
    <input type='radio' id='r1'>
    <input type='radio' id='r2'>
    <input type='radio' id='r3'>
    <input type='radio' id='r4'>
    <input type='radio' id='r5'>
</div>

     var button1 = document.getElementById('button1');
     button1.onclick = function () {
         var noOfButtons = 5;
         var pick = Math.floor(Math.random() * noOfButtons) + 1;
         var radioBtn = document.getElementById('r' + pick);
         radioBtn.checked = true;
     }

[edit]

我认为您要做的是随机检查有限数量的无线电,在这种情况下,不需要将demo的html设置为''。我将myRadios类添加到您的无线电标签中(以防页面上有其他无线电不想包含在随机检查中),然后使用以下功能:

function myFunction() {
    var radios = document.getElementsByClassName('myRadios');
    for (var i=0; i<radios.length; i++)
    {
        radios[i].checked = ( (Math.random()*10) > 5) ? true : false;
    }
}

这是一把正在工作的小提琴。如果这是您想要的功能,或者您对它的工作方式有任何疑问,请告诉我:)