JQuery

JQuery: Marcar e desmarcar todos os checkboxes

Nível: facílimo
Classificação: 5+ anos

<form action="" name="form" method="post">
  <p><input type="checkbox" id="checkTodos" name="checkTodos"> Selecionar Todos</p>
 
  <p><input type="checkbox" value="1"> Item 1</p>
  <p><input type="checkbox" value="2"> Item 2</p>
  <p><input type="checkbox" value="3"> Item 3</p>
  <p><input type="checkbox" value="4"> Item 4</p>
</form>
// Forma 1
$("#checkTodos").click(function(){
    $('input:checkbox').not(this).prop('checked', this.checked);
});
 
// Forma 2
$("#checkTodos").change(function () {
    $("input:checkbox").prop('checked', $(this).prop("checked"));
});
 
// Forma 3
var checkTodos = $("#checkTodos");
checkTodos.click(function () {
  if ( $(this).is(':checked') ){
    $('input:checkbox').prop("checked", true);
  }else{
    $('input:checkbox').prop("checked", false);
  }
});

Para testar o script clique aqui.

Abraço e até o próximo post.

6 thoughts on “JQuery: Marcar e desmarcar todos os checkboxes

  • Valter Ferreira Martins

    Grande Tiago, sempre nos ajudando.
    Obrigado.

    Resposta
  • Marvin

    Código muito útil! Parabéns!

    Resposta
  • Leandro Moquiuti

    Me ajudou muito, muito obrigado!

    Resposta
  • Ilan

    Parabéns…. Simples e direto… todo meu respeito!

    Resposta
  • Victor Amorim

    é possivel trazer do banco os checkbox já carregados? No caso de um cadastro, eles ja vierem com os checkes que foram escolhidos no cadastro ja selecionados?

    Resposta
  • Feliphe Savio

    Excelente meu amigo, muito obrigado, maneiras simples e objetiva.

    Resposta

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *