JavaScript-13（找到单选框的value值与复选框的全选操作） 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <!--弹出被选择的单选框的value值-->
        <input type="button" name="" id="" value="选男选女？" onclick="danxuan()" />
        <br />
        <input type="radio" name="sex"  value="1" />男
        <input type="radio" name="sex"  value="0" />女
        <br />
        <!--复选框的全选操作-->
        <input type="checkbox" id="quanxuan"  onclick="quanxuan()" />全选
        <br />
        <input type="checkbox" name="fruit"  value="1" />苹果
        <input type="checkbox" name="fruit"  value="2" />香蕉
        <input type="checkbox" name="fruit"  value="3" />梨
        <input type="checkbox" name="fruit"  value="4" />橙子
        <input type="checkbox" name="fruit"  value="5" />橘子
        
        <br />
    </body>
</html>


<script type="text/javascript">
    //弹出被选择的单选框的value值
    function danxuan(){
     //用sex1接收sex的集合
    var sex1 = document.getElementsByName("sex");
    //判断sex1集合的哪一个选项被选定
    for(var i=0;i<2;i++){
        if(sex1[i].checked){
            //弹出这个选项的value值
            alert(sex1[i].value);
        }
    }
    }
    
    //复选框的全选操作
    function quanxuan(){
        //用sg接收fruit集合
        var sg = document.getElementsByName("fruit");
        //用qx接收全选的div
        var qx = document.getElementById("quanxuan");
        //for循环循环找到不同的水果
        for(i=0;i<sg.length;i++){
            //如果全选框被选中，所有的水果都被选中，反之则相反。
            if(qx.checked){
            sg[i].checked=true;
            }else{
                sg[i].checked = false;
            }
        }
    }
</script>

 

posted @ 2018-04-15 17:05  张锐0328  阅读(207)  评论(0)    收藏  举报