How to switch between true and false the checked of an input?

4

I have this code and would like to switch between true and false the checked attribute of the input. Strangely, you're catching id of label because the web designer overlapped label to input .

(function($){
    $("label").click(
        function(){
            var idcheck = $(this).attr("for");
            $("input[id="+idcheck+"]").attr("checked", "checked");
        }
    );
})(jQuery);
    
asked by anonymous 05.10.2014 / 02:53

8 answers

15

I would use the following code:

/* Não precisa de JavaScript! */

That is, no code! If your label already has the for attribute pointing to the input, you do not need to use JS. The default behavior of the click on the label is just to reverse the state of the checkbox. Example JSFiddle

The code you posted appears to have been created to try to prevent the checkbox from being unchecked (every click ends with it checked ).

    
05.10.2014 / 18:20
4

use $("input[id="+idcheck+"]").prop('checked', false);

    
05.10.2014 / 02:58
4

Try this:

Teste: <input type="checkbox" id="ck" checked/>

$(document).ready(function(){

   $("#ck").attr('checked', false); 

});
    
05.10.2014 / 03:02
4

I suggest removing all of the checked attribute.

(function ($) {
    $("label").click(function () {
        var idcheck = $(this).attr("for");
        $("input[id=" + idcheck + "]").removeAttr('checked'); // <--
    });
})(jQuery);

Or another similar alternative (give value false ):

(function ($) {
    $("label").click(function () {
        var idcheck = $(this).attr("for");
        $("input[id=" + idcheck + "]").prop("checked", "false"); // <--
    });
})(jQuery);
    
05.10.2014 / 08:54
3

If the webdesigner did not do "extra work" it was not for you to have problem or even need script to check. But if it really is easier to adapt the script than to have to revise the code ...

Do not use attr. Because attributes do not work cool with "live properties" instead use prop () as our friend Sergio and Wriel suggested.

$("label").click(function () {
     var idcheck = $(this).attr("for");
     $("input[id=" + idcheck + "]").prop("checked", "false"); // <--
});

If you use attr, changing the status sometimes will stop working. I've already had this problem and I'm already ahead of you, to avoid a headache. The prop will always bring the current status, since the attr can be lost in memory, and not reflect the current moment.

Here are more details

    
06.10.2014 / 20:35
2

You can use this same code with only a few changes at the time you change checked.

(function($){
    $("label").click(
        function(){
            var idcheck = $(this).attr("for");

            var checkedStatus = $("input[id="+idcheck+"]").attr("checked"); // Aqui eu pego o valor atual do checked no input
            $("input[id="+idcheck+"]").attr("checked", !checkedStatus); // e atribuo um novo valor invertendo o valor antigo
        }
    );
})(jQuery);

In this case it will always invert the input's checked value:

  • If the checked input is true, it will set the new value to false.
  • If the input checked is false it will set the new value to true.
06.10.2014 / 20:01
1

Try this:

$( "input[type='checkbox']:odd" ).attr( "checked", "true" );
    
06.10.2014 / 20:14
0

After catching a little I managed to solve in a nice way: using the denial.

document.getElementById("Checkbox").checked = !document.getElementById("contatoCheckbox").checked;
    
03.03.2016 / 14:50