简单的html JavaScript 问题


<html>
<script language="javascript" type="text/javascript">function fun()
{
 alert(document.input.Sex.value);
}
</script>
<body><form name="input"  method="get">
Male: 
<input type="radio" name="Sex" value="1" checked="checked">
<br>
Female: 
<input type="radio" name="Sex" value="2">
<br>
<input type ="submit" value ="Submit" onclick="return fun()">
</form> </body>
</html>
为什么当我按下submit时，alert出的提示框不显示 1或2 ，而是显示undefined, 关键是我如何解决这个问题怎样能按male获得1，按female 获得2

解决方案 »

  1.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <script language="javascript" type="text/javascript">function fun()
    {
     var radio=document.getElementsByName("Sex");
     for(var i=0;i<radio.length;i++){
    if(radio[i].checked){
    alert(radio[i].value);
    }
     }
    }
    </script>
    <body><form name="input"  method="get">
    Male: 
    <input type="radio" name="Sex" value="1" checked="checked">
    <br>
    Female: 
    <input type="radio" name="Sex" value="2">
    <br>
    <input type ="submit" value ="Submit" onclick="return fun()">
    </form> </body>
    </html>
      

  2.   

     alert(document.input.Sex.value);
     alert(document.input.Sex[0].value);
     alert(document.input.Sex[1].value);
      

  3.   


    <html>
    <script language="javascript" type="text/javascript">
    function fun()
    {
    var slist=document.all['Sex'];
    for(var i=0;i<slist.length;i++){
    if(slist[i].checked){
    alert(slist[i].value)
    }
    }
    }
    </script>
    <body><form name="input"  method="get">
    Male: 
    <input type="radio" name="Sex" value="1" checked="checked">
    <br>
    Female: 
    <input type="radio" name="Sex" value="2">
    <br>
    <input type ="submit" value ="Submit" onclick="return fun();">
    </form> </body>
    </html>
      

  4.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>5_14</title>
    <script src="jquery-1.3.2.js"></script>
    <script language="javascript" type="text/javascript">function fun()
    {
       
    var value = $("form input[type=radio]:checked").val();
    alert("选中的为"+value)
    }
    </script>
    </head><body>
    <form name="input"  method="get">
    Male: 
    <input type="radio" name="Sex" value="1" checked="checked">
    <br>
    Female: 
    <input type="radio" name="Sex" value="2">
    <br>
    <input type ="submit" value ="Submit" onclick="return fun();">
    </form> 
    </body>
    </html>
    引用了一些jquery库，非常简单