使用原生JavaScript获取单选按钮radio的选中值

主要原理就是遍历所有的单选按钮,当某个单选按钮选中的时候,将它对应的值传递给我们赋值的参数,并且跳出遍历循环。

如果想知道如何使用jQuery来获取单选按钮的值,请点击这里。

示例代码:


<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>获取单选按钮选中的值title>
head>
<body>
<label><input type="radio" name="sex" value="m" checked="checked">label>
<label><input type="radio" name="sex" value="f">label>
<button id="button">提交button>
<script type="text/javascript">
    window.onload = function(){
        var val;
        var sex = document.getElementsByName('sex');
        var button = document.getElementById('button');
        button.addEventListener('click',function(){
            for(var i = 0; i < sex.length; i++){
                if(sex[i].checked == true){
                    val = sex[i].value;
                    console.log(val);
                    break;
                }
            }
            return val;         
        },false);
    }
script>
body>
body>
html>

如果想知道如何使用jQuery来获取单选按钮的值,请点击这里。

你可能感兴趣的:(JavaScript,前端集结号,获取单选按钮的值,原生方法)