Hoe reset ik alle selectievakjes met jQuery of pure JS?

Hoe kan ik alle selectievakjes in een document resetten met jQuery of pure JS?


Antwoord 1, autoriteit 100%

Als u bedoelt hoe u de status ‘aangevinkt’ uit alle selectievakjes kunt verwijderen:

$('input:checkbox').removeAttr('checked');

Antwoord 2, autoriteit 34%

Als u de resetfunctie van het formulier wilt gebruiken, kunt u deze het beste gebruiken:

$('input[type=checkbox]').prop('checked',true); 

OF

$('input[type=checkbox]').prop('checked',false);

Het lijkt erop dat removeAttr()niet kan worden gereset door form.reset().


Antwoord 3, autoriteit 10%

Ik heb dit eerder gebruikt:

$('input[type=checkbox]').prop('checked', false);

het lijkt erop dat .attr en .removeAttr in sommige situaties niet werken.

edit: Houd er rekening mee dat u in jQuery v1.6 en hoger in plaats daarvan .prop('checked', false)moet gebruiken voor een grotere compatibiliteit tussen browsers – zie https://api.jquery.com/prop

Reageer hier: Hoe alle selectievakjes resetten met jQuery of pure JS?


Antwoord 4, autoriteit 8%

Het bovenstaande antwoord werkte niet voor mij –

Het volgende werkte

$('input[type=checkbox]').each(function() 
{ 
        this.checked = false; 
}); 

Dit zorgt ervoor dat alle selectievakjes zijn uitgeschakeld.


Antwoord 5, autoriteit 8%

In sommige gevallen is het selectievakje standaard ingeschakeld. Als u de standaardselectie wilt herstellen in plaats van als niet-geselecteerd in te stellen, vergelijkt u de eigenschap defaultChecked.

$(':checkbox').each(function(i,item){ 
        this.checked = item.defaultChecked; 
}); 

Antwoord 6, autoriteit 6%

Javascript

var clist = document.getElementsByTagName("input");
for (var i = 0; i < clist.length; ++i) { clist[i].checked = false; }

jQuery

$('input:checkbox').each(function() { this.checked = false; });

Als u het tegenovergestelde wilt doen, gaat u naar: Selecteer alle selectievakjes op ID/Klasse


Antwoord 7, autoriteit 3%

$(":checkbox:checked").each(function () {
 this.click(); 
});

naar uitgeschakeld aangevinkt vakje, draai je logica om om het tegenovergestelde te doen


Antwoord 8, autoriteit 2%

U kunt selectief zijn in welke div of een deel van uw pagina selectievakjes kunnen hebben aangevinkt en welke niet. Ik kwam het scenario tegen waarin ik twee formulieren op mijn pagina heb en één met vooraf ingevulde waarden (voor update) en andere moeten vers worden ingevuld.

$('#newFormId input[type=checkbox]').attr('checked',false);

hierdoor worden alleen selectievakjes in formulier met id newFormId uitgeschakeld.


Antwoord 9

Ik heb zoiets gebruikt

$(yourSelector).find('input:checkbox').removeAttr('checked');

Antwoord 10

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container check">
<button class="btn">click</button>
  <input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car<br>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car<br>
</div>
<script>
$('.btn').click(function() {
$('input[type=checkbox]').each(function() 
{ 
        this.checked = false; 
}); 
})
</script>
</body>
</html>

Antwoord 11

<input type="checkbox" id="bike" name="vehicle" value="bike">
<label for="bike">Bike</label>
<input type="checkbox" id="car" name="vehicle" value="car">
<label for="car">Car</label>
<button id="select">Select All</button>

JavaScript #1

Krijg alle selectievakjes met behulp van het naamveld,

document.getElementById('select').onclick = function() {
    var checkboxes = document.getElementsByName('vehicle');
    for (var checkbox of checkboxes) {
    checkbox.checked = false;
    }
}

JavaScript #2

Als er geen andere invoertags zijn dan selectievakjes,

document.getElementById('select').onclick = function() {
    var checkboxes = document.getElementsByTagName("input");
    for (var checkbox of checkboxes) {
    checkbox.checked = false;
    }
}

Other episodes