使用js判斷checkbox框是否被選取以及使用js對checkbox進行操作-js教程-PHP中文網

使用js判斷checkbox框是否被選取以及使用js對checkbox進行操作

php是最好的语言

發布： 2018-08-01 10:27:44

原創

2512 人瀏覽過

我們在專案中經常會遇到這個問題：使用js判斷checkbox框是否被選中以及使用js對checkbox進行操作。
其實這些需求很簡單，這裡給出使用原生js和jQuery來完成這些需求。

一.使用原生JavaScript判斷是否選取checkbox方塊

<input type="checkbox" id="test" class="test">同意<script>
    // 获取checkbox元素
    var box=document.getElementById("test");      
    // 判断是否被拒选中，选中返回true，未选中返回false
    alert(box.checked);</script>

登入後複製

二.使用原生JavaScript判斷是否選取checkbox方塊

<input type="checkbox" id="test" class="test">同意<script>
    // 获取checkbox元素
    var box=document.getElementById("test");      
    // 判断是否被拒选中，选中返回true，未选中返回false
    alert(box.checked);</script>

登入後複製

三.使用原生Javascript移除選取的checkbox方塊

<input type="checkbox" id="test" class="test">同意<script>
    // 获取checkbox元素
    var box=document.getElementById("test");      
    // 判断是否被拒选中，选中返回true，未选中返回false
    box.checked=false;</script>

登入後複製

四.使用jQuery判斷是否選取checkbox方塊

<input type="checkbox" id="test" class="test">同意<script>
    // 选中返回true，未选中返回false
    $(&#39;#test&#39;).is(":checked");    // 选中返回true，未选中返回false;一定要注意，这里不可以使用attr("checked")来判断
    $("#test").prop("checked")</script>

登入後複製

五.使用jQuery設定選取checkbox方塊

<input type="checkbox" id="test" class="test">同意<script>
     $("#test").prop("checked","trure")
     $("#test").attr("checked","true")</script>

登入後複製

六.使用jQuery設定移除選取的checkbox框

<input type="checkbox" id="test" class="test">同意<script>
     $("#test").prop("checked","false")
     $("#test").attr("checked","false")</script>

登入後複製

jquery 判斷checkbox是否選取

##js 判斷checkbox是否選取的操作方法_基礎知識

相關影片：

JS#jQuery寬高的理解與應用

以上是使用js判斷checkbox框是否被選取以及使用js對checkbox進行操作的詳細內容。更多資訊請關注PHP中文網其他相關文章！