首頁 > web前端 > js教程 > 主體

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

php是最好的语言
發布: 2018-08-01 10:27:44
原創
2431 人瀏覽過

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

一.使用原生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中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!