實現radio取消功能及checkbox單選

阿新 • • 發佈：2019-01-20

<html>
        <head>
                <title>單選按鈕(radio)的取消與選中</title>
        </head>
        <body>
                <form>
                        <input type="radio" name='radio' value="1" onclick='check(this)'>單選一
                          <input type="radio" name='radio' value="2" onclick='check(this)'>單選二
                </form>
                <script language="javascript">
                    var tempradio= null;
                    function check(checkedRadio)
                    {
                        if(tempradio== checkedRadio){
                            tempradio.checked=false;
                            tempradio=null;
                          }
                           else{
                               tempradio= checkedRadio;
                            }
                     }
                </script>
        </body>
</html>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>CheckBox實現單選功能</title>
</head>
<body>

<script type="text/javascript">
    function selectOne(obj){
    alert(obj.getAttribute("name"));
     var objCheckBox = document.getElementsByName(obj.getAttribute("name"));
     for(var i=0;i<objCheckBox.length;i++){
         //判斷複選框集合中的i元素是否為obj，若為否則便是未被選中
         if (objCheckBox[i]!=obj) {
             objCheckBox[i].checked = false;
         } else{
             //若是，原先為被勾選的變成勾選，反之則變成未勾選
             //objCheckBox[i].checked = obj.checked;

             //或者使用下句，亦可達到同樣效果
             objCheckBox[i].checked = true;
         }
     }
    }
</script>

<form>
    <input type="checkbox" name="checkbox" value="1" onclick="selectOne(this)">複選框 ①<br>
    <input type="checkbox" name="checkbox" value="2" onclick="selectOne(this)">複選框 ②<br>
    <input type="checkbox" name="checkbox" value="3" onclick="selectOne(this)">複選框 ③<br>
    <input type="checkbox" name="checkbox" value="4" onclick="selectOne(this)">複選框 ④<br>
    <input type="checkbox" name="checkbox" value="5" onclick="selectOne(this)">複選框 ⑤<br>
</form>
</body>
</html>

實現radio取消功能及checkbox單選

實現radio取消功能及checkbox單選

吾八哥學Selenium(三)：操作復選框checkbox/單選框radio的方法

DEV 實現CheckBox單選

vue+element-ui實現表格checkbox單選

Android 使用GridView來實現類似RadioButton的多行單選功能

easyui-tree 實現checkbox 單選

JavaScript：checkbox單選框的控制

checkbox單選全選例項

原生js實現一個自定義下拉單選選擇框

jQuery 設定 checkbox 單選/複選框，attr 不可行，prop 才是正確答案

thinkphp5中使用phpmailer實現傳送郵件功能及自己遇到的坑

HTML5：Animate cc互動功能之製作單選框（開關）

使用Jquery獲取Bootstrap Radio Group當前選中的單選框的值

CheckBox 單選按鈕自定義樣式

JQuery實現radio、select、checkbox禁用

DataGridView 新增 checkbox 及設定全選、全部取消功能 « 關於網路那些事...

最簡單清晰的純css實現的單選框radio複選框checkbox自定義樣式

jQuery 實現單選按鈕（radio）勾選和取消，使用prop()代替attr() 踩坑部落格

C#使用List實現類似RadioButtonGroup的單選功能

JQuery實現全選、反選和取消功能

實現radio取消功能及checkbox單選

相關推薦