zoukankan      html  css  js  c++  java
  • 单选,多选,下拉项的取值

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
            <style type="text/css">
                #anniu:hover{
                    cursor: pointer;
                }
            </style>
        </head>
        <body>
            <!--单选按钮的取值-->
            <div id="anniu" onclick="xuanze()">
                点击选择单选项选中的值
            </div>
            <input type="radio" name="sex" id="sex1" value="男" />男
            <input type="radio" name="sex" id="sex2" value="女" />女
            <br />
            <!--多选框的选择-->
            <input type="checkbox" name="duoxuan" id="duoxuan1" value="关羽" />关羽
            <input type="checkbox" name="duoxuan" id="duoxuan2" value="张飞" />张飞
            <input type="checkbox" name="duoxuan" id="duoxuan3" value="赵云" />赵云
            <input type="checkbox" name="duoxuan" id="duoxuan4" value="黄忠" />黄忠
            <input type="checkbox" name="duoxuan" id="duoxuan5" value="马超" />马超
            <input type="checkbox" name="quanxuan" id="quanxuan" value="" onclick="qx()"/>五虎上将
            <br />
            <!--下拉框的选择-->
            <select name="" id="xiala" onchange="bian()">
                <option value="熊猫">熊猫</option>
                <option value="金丝猴">金丝猴</option>
                <option value="鹤顶红">鹤顶红</option>
                <option value="白鳍豚">白鳍豚</option>
            </select>
        </body>
    </html>
    <script type="text/javascript">
        window.onload = function(){
            
        }
        //单选业务的取值
        function xuanze(){
            var sexattr = document.getElementsByName("sex");
            for (var i = 0;i <sexattr.length;i++) {
                if(sexattr[i].checked){   //因为本身返回的就是true,所以直接可以进
                    alert("您选择的性别为:" + sexattr[i].value);
                }
            }
        }
        function qx(){
            var duoxuan = document.getElementsByName("duoxuan");
            var quanxuan = document.getElementById("quanxuan");
            for (var i = 0; i < duoxuan.length;i++) {
                if(quanxuan.checked){
                    duoxuan[i].checked = true;
                }else{
                    duoxuan[i].checked = false;
                }
            }
        }
        function bian(){
            var xiala = document.getElementById("xiala");
            alert(xiala.value);
        }
    </script>
  • 相关阅读:
    SSH框架总结(框架分析+环境搭建+实例源码下载)(转)
    用PowerMockito来mock私有方法(转)
    Mockito简介(转)
    统治世界的十大算法
    ThreadLocal用法和实现原理(转)
    在Eclipse中使用JUnit4进行单元測试(0基础篇)
    libgdx, mouse 关节
    sprintf,你知道多少?
    北京簋街 美食全然攻略 + 簋街好吃的夜宵去处-----店铺介绍大全
    codeforces-148D-Bag of mice-概率DP
  • 原文地址:https://www.cnblogs.com/0328dongbin/p/8857490.html
Copyright © 2011-2022 走看看