原生JavaScript設定、獲取單選框、複選框的值

阿新 • • 發佈：2020-12-08

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <title>原生JavaScript設定、獲取 單選框、複選框 的值</title>
    </head>
    < 
style type="text/css">
        label,
        input {
            cursor: pointer;
        }
    </style>

    <body>
        <label>
            <input type="radio" name="radio" value="radio0" checked /> javascript
        </label>
        <label>
            <input  
type="radio" name="radio" value="radio1" /> python
        </label>
        <label>
            <input type="radio" name="radio" value="radio2" /> java
        </label>
        <hr />

        <input type="button" value="設定" onclick="javascript:setValue('radio','radio2')" 
 />
        <input type="button" value="獲取" onclick="javascript:getValue('radio')" />
        <hr />

        <label>
            <input type="checkbox" name="checkbox" value="checkbox0" checked /> javascript
        </label>
        <label>
            <input type="checkbox" name="checkbox" value="checkbox1" /> python
        </label>
        <label>
            <input type="checkbox" name="checkbox" value="checkbox2" /> java
        </label>
        <hr />

        <input type="button" value="設定" onclick="javascript:setValue('checkbox','checkbox1,checkbox2')" />
        <input type="button" value="獲取" onclick="javascript:getValue('checkbox')" />

        <script type="text/javascript" charset="utf-8">
            /**
             * 根據 name 獲取單選框或複選框 value 
             * @param fieldName name 屬性
             * @return values 字串
             */
            function getValue(fieldName) {
                let obj = document.getElementsByName(fieldName);
                let arr = new Array();

                for (i in obj) {
                    if (obj[i].checked && !obj[i].disabled) arr.push(obj[i].value);
                }
                console.log(arr.join());
                return arr.join();
            }

            /**
             * 根據 name 和 value 設定單選框或複選框
             * @param fieldName name 屬性
             * @param values 字串
             * @return
             */
            function setValue(fieldName, values) {
                let obj = document.getElementsByName(fieldName);
                let arr = values.split(",");

                for (i in obj) {
                    obj[i].checked = "";
                    for (j in arr) {
                        if (arr[j] === obj[i].value) obj[i].checked = "checked";
                    }
                }
            }
        </script>
    </body>
</html>

原生JavaScript設定、獲取單選框、複選框的值

<!DOCTYPE html> <html lang=\"en\"> <head> <meta charset=\"utf-8\"> <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable

MFC中在CScrollView中新增單選按鈕或複選框時，控制元件繪製問題

問題描述由於在實際應用中，可能要動態新增控制元件陣列（即控制元件的數量是可變的，資料改變，控制元件的數量要相應地改變）便需要使用CScrollView，但是在CScrollView中新增單選按鈕或複選框時，若控制元件不在滾

html基本標籤表單實現互動原理，單選框，複選框，下拉框介紹

表單是什麼？表單是前端和伺服器做互動的一種機制，表單收集使用者輸入資訊，之後傳送或者提交給伺服器。使用者在輸入的資訊稱之為內容，內容的文字分為普通和密碼型，使用者通過單選框、複選框、下拉框（也就是下拉

Layui中使用lay-filter給單選框radio新增點選事件（複選框CheckBox可參考）

技術標籤：Layui 直接上程式碼： <form id="upload_form" action="/upload" class="layui-form">

vue中表單的簡單應用（單選框，複選框，下拉框）

表單輸入單選框 <div>性別：<input type=\"radio\" name=\'sex\' value=\'0\' v-model=\'regList.sex\'> 男<input type=\"radio\" nam