我怎么打电话给单选按钮?

时间:2013-06-24 18:15:23

标签: javascript html radio-button

我想在现有的单选按钮响应中为yes / no的响应添加文本,但我不确定如何这样做。它将在这个jsFiddle http://jsfiddle.net/pjdicke/zudCf/2/

中的第39行附近
<p>Yes <input type="radio" name="another" value="anotherYes" /></p>
<p>No <input type="radio" name="another" value="anotherNo" /></p>

我需要添加什么才能根据是/否响应显示文字?

HTML部分中的第39行是我引用的代码所在的位置。我希望答案是肯定/否定,根据答案得到2个回答。例如:天蓝色(不)=为什么你不认为天空是蓝色的,你不喜欢蓝色吗? (是)=蓝色对你做了什么?但如果答案是=(不)蓝色是一种很棒的颜色

1 个答案:

答案 0 :(得分:0)

我讨厌匿名函数。虽然他们可以有一个地方,但它主要只是懒惰的编程,imho。

以下是一些代码,希望您能够更清楚地理解这些代码。

<!DOCTYPE html>
<html>
<head>
<script>
window.addEventListener('load', mInit, false);

function mInit()
{
    var radioBtns = document.querySelectorAll("input[type=radio]");
    var i, n = radioBtns.length;
    for (i=0; i<n; i++)
    {
        var btnGroupName = radioBtns[i].getAttribute('name');

        if (btnGroupName == 'yesNo')
            radioBtns[i].addEventListener('change', onRbGroup1Change, false);

        else if (btnGroupName == 'gender')
            radioBtns[i].addEventListener('change', onRbGroup2Change, false);
    }
}
function onRbGroup1Change()
{
    document.getElementById('radioResult').innerHTML = "Value of chosen radio button is: " + this.value;
}
function onRbGroup2Change()
{
    document.getElementById('radioResult2').innerHTML = "Gender of chosen radio button is: " + this.value;
}

</script>
<style>
</style>
</head>
<body>

<label>Yes<input type="radio" name="yesNo" value="afirmative"/></label>
<label>No<input type="radio" name="yesNo" value="negative"/></label>
<div id='radioResult'>You need to select a radio-button first!</div>

<label>Girl<input type="radio" name="gender" value="Female"/></label>
<label>Boy<input type="radio" name="gender" value="Male"/></label>
<div id='radioResult2'>You need to select a radio-button first!</div>

</body>
</html>