0

我有以下代码，我想在其中检查 3 组单选按钮的值，更改系数，然后进行一些计算。它似乎没有识别循环的组，并告诉我没有选择按钮。我没有正确测试这个吗？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML meta http-equiv="content-type" content="text/html; charset=UTF-8">
 <HEAD>
 <TITLE>Couch Shifts</TITLE>
<script type="text/javascript">     
    function tableShifts()
    {
        var curVert = Number(document.getElementById("curVert").value);
        var curLat = Number(document.getElementById("curLat").value);
        var curLong = Number(document.getElementById("curLong").value);
        var pinVert = Number(document.getElementById("pinVert").value);
        var pinLat = Number(document.getElementById("pinLat").value);
        var pinLong = Number(document.getElementById("pinLong").value);

        var coVert = 1;
        var coLat = 1;
        var coLong = 1;

        var group1Array = document.getElementsByName("group1");
        for (i=0; i<group1Array.length; i++)
        {
            if (group1Array[i].checked)
            {
                group1Array = group1Array[i].Value;
                break;
            }
            else
            {
                alert("Button Not Selected")
            }
        }           
        var group2Array = document.getElementsByName("group2");
        for (i=0; i<group2Array.length; i++)
        {
            if (group2Array[i].checked)
            {
                group2Array = group2Array[i].Value;
                break;
                alert(group2Array[i].Value);
            }
            else
            {
                alert("Button Not Selected")
            }
        }
        var group3Array = document.getElementsByName("group3");
        for (i=0; i<group3Array.length; i++)
        {
            if (group3Array[i].checked)
            {
                group3Array = group3Array[i].Value;
                break;
            }
            else
            {
                alert("Button Not Selected")
            }
        }           

        switch(group1Array)
        {
            case "Up":
                coVert = 1;
                break;
            case "Down":
                coVert = -1;
                break;                  
        }
        switch(group2Array)
        {
            case "Lt":
                coLat = 1;
                break;
            case "Rt":
                coLat = -1;
                break;                  
        }
        switch(group3Array)
        {
            case "In":
                coLong = 1;
                break;
            case "Out":
                coLong = -1;
                break;                  
        }

            document.getElementById("gotoVert").value = curVert + pinVert*coVert;
            document.getElementById("gotoLat").value  = curLat + pinLat*coLat;
            document.getElementById("gotoLong").value = curLong + pinLong*coLong;
        }


</script>
  </HEAD>
  <BODY>    
<div id = "Calcs" style="margin-bottom: 160px;">
<style>
    label { float: left; width: 35px; font-size:17px; color:#0000FF}
    #column1{ float: left; position: relative; z-index: 0; width: 150px; font-size:20px;}
    #column2{ float: left; position: relative; z-index: 1; width: 160px; font-size:20px;}
    #column3{ float: left; position: relative; z-index: 2; width: 160px; font-size:20px;}
    #button { position: absolute; }
    #input.radio{ margin-left: 1px; }
</style>
<div id="column1">Current Position</br></br>        
    <label for="Vert">Vert</label></br>
    <input type="text", id="curVert" size="10" value="" /></br>             
    <label for="Lat">Lat</label></br>
    <input type="text" size="10", id="curLat" value="" /></br>
    <label for="Long">Long</label></br>
    <input type="text" size="10", id="curLong" value="" /></br>
</div>

<div id="column2">Pinnacle Shifts<br><br>           
    <label for="Vert">Vert</label>
        <input type="radio" name="group1" value="Up"/><font size="2">Up</font>  
        <input type="radio" name="group1" value="Down"/><font size="2">Down</font>
    <input type="text", id="pinVert" size="10" value="" /></br>         
    <label for="Lat">Lat</label>
        <input type="radio" name="group2" value="Lt"/><font size="2">Lt</font>  
        <input type="radio" name="group2" value="Rt"/><font size="2">Rt</font>
    <input type="text", id="pinLat" size="10" value="" /></br>                      
    <label for="Long">Long</label>
        <input type="radio" name="group3" value="In"/><font size="2">In</font>  
        <input type="radio" name="group3" value="Out"/><font size="2">Out</font>
    <input type="text", id="pinLong" size="10" value="" />                  
</div>

<div id="column3">Calculated Shifts</br></br>
    <label for="Vert">Vert</label></br>
    <input type="text", id="gotoVert" size="10" value="" readonly="readonly" style="background-color:#D8D8D8 ;"/></br>
    <label for="Lat">Lat</label></br>
    <input type="text", id="gotoLat" size="10" value="" readonly="readonly" style="background-color:#D8D8D8 ;"/></br>
    <label for="Long">Long</label></br>
    <input type="text", id="gotoLong" size="10" value="" readonly="readonly" style="background-color:#D8D8D8 ;"/>       
</div><br />
</div>

<div id="button">
    <input type = "button" style="margin-top: 10px;" value="Calculate Shifts" onclick="tableShifts();" />
    <input type = "button" style="margin-top: 10px;" value="Reset" onclick="clear();" />
</div>

4

2 回答 2

0

如果您实现 JQuery（javascript 库），您可以轻松检查选中的单选按钮。

if( $("#someRadioButton").is(":checked") )
{ 
     // doSomething 
}

或者，你可以...

// Get the ID of the radio button checked
var id = $("input[@name=radioGroup]:checked").attr('id');

// Get the value of the radio button checked
var value = $("input[@name=radioGroup]:checked").val();
于 2013-04-24T15:37:20.907 回答
0

将您的代码更改为：

var group1Array = document.getElementsByName("group1");
var gr1 = 0;
for (i = 0; i < group1Array.length; i++) {
    if (group1Array[i].checked) {
        group1Array = group1Array[i].value;
        break;
    }
    else gr1++;
}
if (gr1 == group1Array.length) {
    alert("Button Not Selected");
}

http://jsfiddle.net/vMHMR/

因此，alert只有在未选中组中的单选按钮时才显示。

于 2013-04-24T19:50:04.183 回答