内乡程序:JS获取复选框中当前选中的值 尚春台,ai2hao.com 

内乡程序:JS获取复选框中当前选中的值

导读:内乡程序:JS获取复选框中当前选中的值

<!DOCTYPE html> <html> <head>  

  <meta charset="UTF-8" />    

<title>onchange</title> </head> 

<script type="text/javascript">    

window.function() {      

  var aFruit=document.getElementsByName("checkfruit");       

  var oSelectAll=document.getElementById("selectAll");      

  var oP=document.getElementById("cendndn");      

  var str="";         //全选/全不选       

  oSelectAll.onchange=function() {        

    if(this.checked) {             

    for(var i=0;i<aFruit.length;i++) {       

              aFruit[i].checked=true;              

      str+=aFruit[i].value+" ";                 }        

        oP.innerText="你选择的瓜是:"+str;         

    }else {            

    for(var i=0;i<aFruit.length;i++) {   

                  aFruit[i].checked=false;           

      }               

  oP.innerText="你没有选择任何瓜";          

      str="";             }         }      

  //单个点击复选框         var str1="";      

  for(var i=0;i<aFruit.length;i++) {        

    aFruit[i].onchange=function() {             

    if(this.checked) {                 

    str1=str1+this.value+" ";               

  }else {                   

  str1=str1.replace(this.value,"");              

  }                 oP.innerText="你选择的瓜是:"+str1;       

      }         }     } </script> <body>     <div>       

  <label><input type="checkbox" id="selectAll"/>全选/全不选:</label><br /><br />     

    <label><input type="checkbox" name="checkfruit" value="冬瓜"/>冬瓜</label>   

      <label><input type="checkbox" name="checkfruit" value="南瓜"/>南瓜</label>    

    <label><input type="checkbox" name="checkfruit" value="西瓜"/>西瓜</label>     

    <label><input type="checkbox" name="checkfruit" value="北瓜"/>北瓜</label>   

  </div>     <p id="cendndn"></p> 

</body> </html>

广告位置