web-dev-qa-db-fra.com

Comment décocher la case à l'aide de la bibliothèque jQuery Uniform

J'ai un problème avec décocher un checkbox. Jetez un oeil à my jsFiddle , où je tente:

   $("#check2").attr("checked", true);

J'utilise niforme pour styliser la checkbox et cela ne fonctionne tout simplement pas pour cocher/décocher la checkbox.

Des idées?

jquerycheckbox
144
Artjom Zabelin

En regardant leurs documents, ils ont une fonction $.uniform.update pour actualiser un élément "uniforme".

Exemple: http://jsfiddle.net/r87NH/4/

$("input:checkbox").uniform();

$("body").on("click", "#check1", function () {
    var two = $("#check2").attr("checked", this.checked);
    $.uniform.update(two);
});
108
user113716

Une solution plus simple consiste à faire cela plutôt que d'utiliser l'uniforme:

$('#check1').prop('checked', true); // will check the checkbox with id check1
$('#check1').prop('checked', false); // will uncheck the checkbox with id check1

Cela ne déclenchera aucune action de clic définie.

Vous pouvez aussi utiliser:

$('#check1').click(); //

Cela activera la case à cocher/décocher la case à cocher, mais déclenchera également toute action de clic que vous avez définie. Donc sois prudent.

EDIT: jQuery 1.6+ utilise prop() pas attr() pour les cases à cocher valeur cochée

367
Mr.Hunt
$("#chkBox").attr('checked', false);

Cela a fonctionné pour moi, cela va décocher la case. De la même manière, nous pouvons utiliser

$("#chkBox").attr('checked', true);

cocher la case.

24
user1683014

Si vous utilisez niform 1.5 , utilisez cette astuce simple pour ajouter ou supprimer un attribut de vérification
Ajoutez simplement value = "check" dans le champ de saisie de votre case à cocher.
Ajoutez ce code dans uniform.js> function doCheckbox(elem){> .click(function(){

if ( $(elem+':checked').val() == 'check' ) {
    $(elem).attr('checked','checked');           
}
else {
    $(elem).removeAttr('checked');
}

si vous ne souhaitez pas ajouter value = "check" dans votre zone de saisie car dans certains cas, vous ajoutez deux cases à cocher, utilisez

if ($(elem).is(':checked')) {
 $(elem).attr('checked','checked');
}    
else
{    
 $(elem).removeAttr('checked');
}

Si vous utilisez niform 2. , utilisez cette astuce simple pour ajouter ou supprimer un attribut de vérification.
dans cette classUpdateChecked($tag, $el, options) { changement de fonction

if ($el.prop) {
    // jQuery 1.6+
    $el.prop(c, isChecked);
}

À

if ($el.prop) {
    // jQuery 1.6+
    $el.prop(c, isChecked);
    if (isChecked) {
        $el.attr(c, c);
    } else {
        $el.removeAttr(c);
    }

}
13
Sohail Ahmed
$('#check1').prop('checked', true).uniform(); 
$('#check1').prop('checked', false).uniform();

Cela a fonctionné pour moi.

7
Parijat

Faites juste ceci:

$('#checkbox').prop('checked',true).uniform('refresh');
2
moledet
 $("#checkall").change(function () {
            var checked = $(this).is(':checked');
            if (checked) {
                $(".custom-checkbox").each(function () {
                    $(this).prop("checked", true).uniform();
                });
            } else {
                $(".custom-checkbox").each(function () {
                    $(this).prop("checked", false).uniform();
                });
            }
        });

        // Changing state of CheckAll custom-checkbox
        $(".custom-checkbox").click(function () {
            if ($(".custom-checkbox").length == $(".custom-checkbox:checked").length) {
                $("#chk-all").prop("checked", true).uniform();
            } else {
                $("#chk-all").removeAttr("checked").uniform();
            }
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id='checkall' /> Select All<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="PHP"> PHP<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="AngularJS"> AngularJS<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="Python"> Python<br/>
 <input type="checkbox" class='custom-checkbox' name="languages" value="Java"> Java<br/>
1
P.Mondal

Dans certains cas, vous pouvez utiliser ceci:

$('.myInput').get(0).checked = true

Pour basculer, vous pouvez utiliser if else avec function

1
Larionov Nikita

vous devez appeler $.uniform.update() si vous mettez à jour un élément à l'aide de javascript, comme indiqué dans la documentation.

1
Adeel

Tout d'abord, checked peut avoir une valeur de checked ou une chaîne vide.

$("input:checkbox").uniform();

$('#check1').live('click', function() {
    $('#check2').attr('checked', 'checked').uniform();
});
1
nyuszika7h

L'autre façon de faire est,

utiliser $('#check2').click();

cela provoque l'uniformité pour cocher la case et mettre à jour ses masques

0
Hailwood