Javascript 根据选择的单选按钮返回不同的答案_Javascript_Html_Radio

Javascript 根据选择的单选按钮返回不同的答案

javascript html

Javascript 根据选择的单选按钮返回不同的答案,javascript,html,radio,Javascript,Html,Radio,HTML: 紫色卡片上有你的号码吗？是否绿卡上有你的号码吗？是否蓝卡上有你的号码吗？是否粉色卡片上有你的号码吗？是否红牌上有你的号码吗？是否橙色卡片上有你的号码吗？是否查看结果使用JavaScript，我试图根据哪些单选按钮是“是”和哪些是“否”返回不同的结果。例如，yes no no no将返回答案1是否将返回答案2，以此类推，返回36个可能的结果这个问题来自于这里的纸牌游戏：当您单击按钮时，会调用一个简单的函数，它使用Ja

HTML:



紫色卡片上有你的号码吗？
是

否



绿卡上有你的号码吗？
是

否



蓝卡上有你的号码吗？
是

否



粉色卡片上有你的号码吗？
是

否



红牌上有你的号码吗？
是

否



橙色卡片上有你的号码吗？
是

否



查看结果

使用JavaScript，我试图根据哪些单选按钮是“是”和哪些是“否”返回不同的结果。例如，

yes no no no

将返回答案1<代码>是否将返回答案2，以此类推，返回36个可能的结果

这个问题来自于这里的纸牌游戏：

当您单击按钮时，会调用一个简单的函数，它使用JavaScript选择所有元素并警告这两个值

我添加了一个表单标记，其中包含列表中的所有元素，以便我可以选择其中的输入：

<ul>
    <li>
        <h5>Does the PURPLE card have your number?</h5>
        <input type="radio" name="card1" value="A">yes<br>
        <input type="radio" name="card1" value="B">no<br>
    </li>
    <li>
        <h5>Does the GREEN card have your number?</h5>
        <input type="radio" name="card2" value="A">yes<br>
        <input type="radio" name="card2" value="B">no<br>
    </li>
    <li>
        <h5>Does the BLUE card have your number?</h5>
        <input type="radio" name="card3" value="A">yes<br>
        <input type="radio" name="card3" value="B">no<br>
    </li>
    <li>
        <h5>Does the PINK card have your number?</h5>
        <input type="radio" name="card4" value="A">yes<br>
        <input type="radio" name="card4" value="B">no<br>
    </li>
    <li>
        <h5>Does the RED card have your number?</h5>
        <input type="radio" name="card5" value="A">yes<br>
        <input type="radio" name="card5" value="B">no<br>
    </li>
    <li>
        <h5>Does the ORANGE card have your number?</h5>
        <input type="radio" name="card6" value="A">yes<br>
        <input type="radio" name="card6" value="B">no<br>
    </li>     
</ul>

<button onclick="returnScore()">View Results</button>


函数showValues（）{
var输入=document.getElementById（“表单”）.elements；
var countYes=0；
var countNo=0；
对于（变量i=0；i

紫色卡片上有你的号码吗？
是

否



绿卡上有你的号码吗？
是

否



蓝卡上有你的号码吗？
是

否



粉色卡片上有你的号码吗？
是

否



红牌上有你的号码吗？
是

否



橙色卡片上有你的号码吗？
是

否

您似乎忘记回答问题了。请阅读和阅读。

<script>
function showValues() {
    var inputs = document.getElementById("form").elements;
    var countYes = 0;
    var countNo = 0;
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].type == 'radio' && inputs[i].checked)
            if(inputs[i].value == "A") {
            countYes++;
            } else if(inputs[i].value == "B") {
            countNo++;
          }
    }
    alert("Number of Yes': " + countYes);
    alert("Number of No's: " + countNo);
}
</script>


<body>
<form id="form">
<ul>
    <li>
        <h5>Does the PURPLE card have your number?</h5>
        <input type="radio" name="card1" value="A">yes<br>
        <input type="radio" name="card1" value="B">no<br>
    </li>
    <li>
        <h5>Does the GREEN card have your number?</h5>
        <input type="radio" name="card2" value="A">yes<br>
        <input type="radio" name="card2" value="B">no<br>
    </li>
    <li>
        <h5>Does the BLUE card have your number?</h5>
        <input type="radio" name="card3" value="A">yes<br>
        <input type="radio" name="card3" value="B">no<br>
    </li>
    <li>
        <h5>Does the PINK card have your number?</h5>
        <input type="radio" name="card4" value="A">yes<br>
        <input type="radio" name="card4" value="B">no<br>
    </li>
    <li>
        <h5>Does the RED card have your number?</h5>
        <input type="radio" name="card5" value="A">yes<br>
        <input type="radio" name="card5" value="B">no<br>
    </li>
    <li>
        <h5>Does the ORANGE card have your number?</h5>
        <input type="radio" name="card6" value="A">yes<br>
        <input type="radio" name="card6" value="B">no<br>
    </li>     
</ul>
</form>
<input type="button" onclick="showValues();" value="click" />