原生JS實現選中的radio變為未選中

本文轉載自查看原文 2019-01-09 11:23 1702 javascript

需求如下，radio已經選中，再點擊，取消選中狀態。

效果如鏈接：演示地址

直接上代碼：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <input type="radio" name="sex" id="sex1" value="1"><label for='sex1'>男</label>
        <input type="radio" name="sex" id="sex0" value="0"><label for='sex0'>女</label>
        <script>
            var selectID = null;
            var els = document.querySelectorAll("[name=sex]")
            for (el of els) {
                el.addEventListener("click", function() {
                    if (selectID == this.id && selectID) {
                        this.checked = ""
                        selectID = null;
                    } else {
                        selectID = this.id;
                    }
                })
            }

            function GetRadioValue(radioName) {
                var radios = document.getElementsByName(radioName);
                for (var i = 0; i < radios.length; i++) {
                    var radio = radios.item(i);
                    if (radio.checked) {
                        return radio.value;
                    }
                }
            }
        </script>
    </body>
</html>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 js控制radio選中原生js實現選中所有的checkbox Radio控件選中取消 (JS) js判斷radio選中狀態 js獲取radio選中索引值在js中取選中的radio值 js中對radio和checkbox是否選中的判斷在JS中設置Select和radio選中 checked="checked"無效，radio未選中問題排查設置checked="checked"或者(checked,true)無效，radio未選中