Question

单击单选按钮后如何获得其价值？

document.getElementById('btnKnop1').addEventListener('click', function(){

        var kleuren = document.querySelectorAll('input[type=radio');

        for (var i in kleuren) {
            kleuren[i].onclick = function(){
                document.getElementById('divResult'). innerHTML = 
                'Gekozen kleur: ' + this.value;
            }
        }

        });

<input type="radio" name="radioGroup" value="rood" checked />Rood</br />
<input type="radio" name="radioGroup" value="blauw"  />Blauw</br />
<input type="radio" name="radioGroup" value="geel"  />Geel</br />
<input type="radio" name="radioGroup" value="groen"  />Groen</br />

<button id="btnKnop1">Check de waarde!</button>

<div id="divResult"></div>

现在，它取决于单击单选按钮，但我要依赖单击该按钮

Answer 1

首先，请考虑使用英文名称的变量，它将大大提高可读性。

第二行，

var kleuren = document.querySelectorAll('input[type=radio');

有错别字，缺少右方括号-]。

要检查复选框/单选按钮的值，可以使用checkbox.checked，其中checkbox是querySelector选择的DOM对象。

Answer 2

您基本上已经在这样做了。当您单击按钮时，在按钮的单击处理程序中，只需使用选择器（类或ID）并通过“ querySelector”调用（就像您所做的那样）就可以获取单选按钮元素。检查该元素的属性是否有意义（可能已“选中”）。

类似：

2.59

查看此处：

https://www.w3schools.com/jsref/prop_radio_checked.asp

Answer 3

问题似乎是单选按钮上的内部点击事件。如果将循环更改为if语句以检查是否已选中，则可以在按钮click上输出值：

document.getElementById('btnKnop1').addEventListener('click', function(){

        var kleuren = document.querySelectorAll('input[type=radio');

        for (var i in kleuren) {
            
            if (kleuren[i].checked === true) {
            document.getElementById('divResult'). innerHTML = 
                'Gekozen kleur: ' + kleuren[i].value;
            }
        
       }

});

<input type="radio" name="radioGroup" value="rood" checked />Rood</br>
<input type="radio" name="radioGroup" value="blauw"  />Blauw</br>
<input type="radio" name="radioGroup" value="geel"  />Geel</br>
<input type="radio" name="radioGroup" value="groen"  />Groen</br>

<button id="btnKnop1">Check de waarde!</button>

<div id="divResult"></div>

Answer 4

选中的属性将告诉您是否选择了元素：

if (document.getElementById('id').checked) {
    var variable = document.getElementById('id').value;
}

单击后如何获取单选按钮的值

4 个答案: