Seleccionar un grupo de chekbox’s con jQuery
A continuación se expone un script para seleccionar/deseleccionar un grupo de checkboxes con jQuery. En mi opinión, quizá la forma más adecuada de acceder a los checkboxes mediante jQuery es asignándoles una clase. De esta forma podemos actuar sobre los checkboxes de una manera selectiva. Podremos tener más elementos de este tipo en nuestra página web pero sólo actuaremos sobre los que poseen determinada clase.
Lo primero que debemos hacer es incluir la librería jQuery dentro de la etiqueta <head>.
Seguidamente también en el <head> debemos incluir la función que se encargará de seleccionar o deseleccionar el grupo de checkboxes.
<script language="javascript">
$(document).ready(function(){
$(".check_todos").click(function(event){
if($(this).is(":checked")) {
$(".ck:checkbox:not(:checked)").attr("checked", "checked");
}else{
$(".ck:checkbox:checked").removeAttr("checked");
}
});
});
</script>
Finalmente, dentro del <body> necesitaremos insertar los checkboxes de la siguiente forma:
<form> <p><input name="Todos" type="checkbox" value="1" class="check_todos"/>Seleccionar todos</p> <p> <input name="elemento1" type="checkbox" value="1" class="ck"/>elemento 1<br /> <input name="elemento2" type="checkbox" value="2" class="ck"/>elemento 2<br /> <input name="elemento3" type="checkbox" value="3" class="ck"/>elemento 3<br /> <input name="elemento4" type="checkbox" value="4" class="ck"/>elemento 4<br /> <input name="elemento5" type="checkbox" value="5" class="ck"/>elemento 5</p> </form>
Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Muy buen post ahora se ocupa .prop en lugar de .attr
$(«.check_todos»).click(function(event){
if($(this).is(«:checked»)) {
$(«.ck:checkbox:not(:checked)»).prop(«checked», true);
}else{
$(«.ck:checkbox:checked»).prop(«checked», false);
}
Yoo, truly great piece of writing…
Good day! I could have sworn I’ve been to this blog before but after browsing through some of the post I realized it’s
new to me. Anyways, I’m definitely glad I found it and I’ll be book-marking and checking back often!
my web page; Jenni
… [Trackback]…
[…] Read More: jose-aguilar.com/blog/seleccionar-grupo-chekboxs-jquery/ […]…
Related Web Site…
[…]Here is a superb Blog You might Obtain Fascinating that we Encourage You[…]…
I like this post, enjoyed this one thankyou for putting up.
I’ve recently started a blog, the info you provide on this site has helped me tremendously. Thanks for all of your time & work.
Some really quality posts on this site, saved to my bookmarks .
Great write-up, I am regular visitor of one’s site, maintain up the excellent operate, and It’s going to be a regular visitor for a lengthy time.
Heya! I know this is kind of off-topic but I needed to ask. Does operating a well-established blog like yours require a large amount of work? I’m completely new to blogging but I do write in my journal on a daily basis. I’d like to start a blog so I can easily share my experience and thoughts online. Please let me know if you have any kind of ideas or tips for new aspiring bloggers. Thankyou!
Hi, i think that i noticed you visited my web site thus i came to “go back the favor”.I’m attempting to find things to enhance my web site!I assume its good enough to make use of a few of your ideas!!
Thanks for sharing excellent informations. Your web site is so cool. I am impressed by the details that you’ve on this site. It reveals how nicely you perceive this subject. Bookmarked this website page, will come back for extra articles. You, my pal, ROCK! I found simply the info I already searched everywhere and simply couldn’t come across. What an ideal web-site.
I gotta favorite this website it seems very helpful extremely helpful
Great beat ! I wish to apprentice whilst you amend your web site, how could i subscribe for a weblog website? The account aided me a appropriate deal. I have been tiny bit acquainted of this your broadcast provided bright clear concept.