簡體   English   中英

選中其他復選框時如何取消選中復選框?

[英]How to uncheck checkboxes when check other one?

我有四個復選框,最初都被選中了。 當我單擊“無”復選框時,其他復選框均未選中。

HTML

<label class='checkbox'><input type='checkbox' name='a' class="example"  value='1000' checked/>A</label>
<label class='checkbox'><input type='checkbox' name='b' class="example" value='1000' class='termcls'checked />B</label>
<label class='checkbox'><input type='checkbox' name='c' class="example" value='1000' checked/>C</label>
<label class='checkbox'><input type='checkbox' name='none' onchange="uncheckOthers()" value='0' class='termcls'/>(None)</label>

jQuery的

 function uncheckOthers()
 {
    $('input.example').not(this).prop('checked', false); 
 }

正如Tushar所提到的, this是指uncheckOtherswindowuncheckOthers不是None復選框元素。

如果您正在調用內聯函數和期待當前元素為this在哈德勒,通過this作為參數。

嘗試這個:

  function uncheckOthers(elem) { $('input.example').not(elem).prop('checked', !elem.checked); } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <label class='checkbox'> <input type='checkbox' name='a' class="example" value='1' checked/>A</label> <label class='checkbox'> <input type='checkbox' name='b' class="example" value='2' class='termcls' checked />B</label> <label class='checkbox'> <input type='checkbox' name='c' class="example" value='3' checked/>C</label> <label class='checkbox'> <input type='checkbox' name='none' onchange="uncheckOthers(this)" value='0' class='termcls' />(None)</label> 

在這里擺弄

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>

    $(document).ready(function () {


    });
    function uncheckOthers() {
        $('input.example').prop('checked', false);
    }
</script>
</head>

<body>
   <label class='checkbox'><input type='checkbox' name='a' class="example"  value='1' checked/>A</label>
<label class='checkbox'><input type='checkbox' name='b' class="example" value='2' class='termcls'checked />B</label>
<label class='checkbox'><input type='checkbox' name='c' class="example" value='3' checked/>C</label>
<label class='checkbox'><input type='checkbox' name='none' onchange="uncheckOthers()" value='0' class='termcls'/>(None)</label>
</body>

</html>

只是為了補充上面的答案,我執行了一個功能,如果選中了另一個復選框,則取消選中無復選框。

  function uncheckOthers(elem) { $('input.example').not(elem).prop('checked', !elem.checked); } function uncheckNone(elem) { if(elem.checked) { $('input.termcls').prop('checked', false); } } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <label class='checkbox'> <input type='checkbox' name='a' onchange="uncheckNone(this)" class="example" value='1' checked/>A</label> <label class='checkbox'> <input type='checkbox' name='b' onchange="uncheckNone(this)" class="example" value='2' class='termcls' checked />B</label> <label class='checkbox'> <input type='checkbox' name='c' onchange="uncheckNone(this)" class="example" value='3' checked/>C</label> <label class='checkbox'> <input type='checkbox' name='none' onchange="uncheckOthers(this)" value='0' class='termcls' />(None)</label> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM