获取表单值

<html>  
<head>  
<title>Form Example   
</title>  
<style>  
         form{  border: 1px dotted #AAAAAA; padding: 10px 6px 1px 6px;  margin:10px;    font:14px Arial;}   
</style>  
<script language="javascript">       
     function showText(){   
        var formValue= document.getElementById("name").value;   
        //var formValue= valueForm.name.value;//document.valueForm.name.value   
        //var formValue= document.forms['valueForm'].name.value;   
      //var formValue= document.forms['valueForm']['name'].value;   
        //var formValue= document.forms['valueForm'][0].value;   
        //var formValue= document.forms[0].name.value;   
        //var formValue= document.forms[0]['name'].value;   
        //var formValue= document.forms[0][0].value;   
        //var formValue= valueForm.elements[0].value;   
        //var formValue= valueForm.elements['name'].value;   
        //var formValue= valueForm.elements.name.value;   
        alert('姓名:'+formValue);     
            }    
   function showSelect(){   
    var oSelectBox = valueForm.color;   
      var iChoice = oSelectBox.selectedIndex;   //获取选中项   
      var stvalue="您选中了:" + oSelectBox.options[iChoice].text;//获取选中项文本   
      //var svalue=oSelectBox.options[iChoice].value;//获取选中项文本值 document.getElementById("color").value   
      alert(stvalue);   
    }   
    function showRadio(){   
     var aChoices = valueForm.sex;
     alert(document.valueForm.sex[0].value);   
     var rvalue='';   
       for(var i=0;i<aChoices.length;i++){      
           if(aChoices[i].checked)   
              rvalue=aChoices[i].value;   
         }   
       alert("您选择的是:"+rvalue);   
    }   
        function showCheckbox(){   
             var aChoices = valueForm.hobby;   
             var cvalue='';   
         for(var i=0;i<aChoices.length;i++){    
             if(aChoices[i].checked)   
               cvalue+=aChoices[i].value+',';   
         }   
       alert("您选择的是:"+cvalue);   
    }   
</script>  
</head>  
<body>       
<form method="post" name="valueForm">  
     <!--获取文本框值request.getParameter("name")获得指定name属性的值,否则返回null-->    
       <input type="text" name="name" id="name" value="zhaozhi3758">&nbsp;    
       <input type="button" value="文本值"  onclick="showText()"><br><br>  
   <!--获取下拉框文本:request.getParameter("color")可以获得选中状态的值-->    
   <select name="color" id="color">  
            <option value="red">红</option>  
            <option value="green">绿</option>  
            <option value="blue">蓝</option>  
            <option value="yellow" selected>黄</option>  
            <option value="cyan">青</option>  
            <option value="purple">紫</option>    
  </select>&nbsp;    
  <input type="button" onclick="showSelect()" value="查看选项"/><br><br>  
  <!--获取单选按钮值;request.getParameter("sex")可以获得选中状态的值-->    
  <input type="radio" name="sex"  value="male" checked>男   
    <input type="radio" name="sex"  value="female">女   
  <input type="button" value="检测按钮值" onclick="showRadio();"><br><br>  
  <!--获取复选框值:request.getParameter("hobby")可以获得第一个处于选中状态的值,后面的覆盖-->    
  <input type="checkbox" name="hobby" id="book" value="book">看书   
    <input type="checkbox" name="hobby" id="net" value="net">上网   
    <input type="checkbox" name="hobby" id="sleep" value="sleep">睡觉   
    <input type="button" value="复选值" onclick="showCheckbox();" />  
 </form>  
</body>  
</html> 

你可能感兴趣的:(html)