Découvrez si le bouton radio est coché avec JQuery ?

Question

Je peux très bien définir un bouton radio comme étant coché, mais ce que je veux faire, c'est configurer une sorte d'écouteur qui s'active lorsqu'un certain bouton radio est coché.

Prenez, par exemple, le code suivant :

$("#element").click(function()
{ 
    $('#radio_button').attr("checked", "checked");
});

il ajoute un attribut vérifié et tout va bien, mais comment puis-je faire pour ajouter une alerte. Par exemple, qui s'affiche lorsque le bouton radio est coché sans l'aide de la fonction "click" ?

Answer 1

$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});

Answer 2

Si vous avez un groupe de boutons radio partageant le même attribut de nom et que, lors de l'envoi ou d'un événement quelconque, vous voulez vérifier si l'un de ces boutons radio a été coché, vous pouvez le faire simplement avec le code suivant :

$(document).ready(function(){
  $('#submit_button').click(function() {
    if (!$("input[name='name']:checked").val()) {
       alert('Nothing is checked!');
        return false;
    }
    else {
      alert('One of the radio buttons is checked!');
    }
  });
});

Source :

Réf. API jQuery

Answer 3

Comme la solution de Parag a généré une erreur pour moi, voici ma solution (combinant celle de David Hedlund et celle de Parag) :

if (!$("input[name='name']").is(':checked')) {
   alert('Nothing is checked!');
}
else {
   alert('One of the radio buttons is checked!');
}

Cela a bien fonctionné pour moi !

Answer 4

Vous devez lier l'événement de clic de la case à cocher, car l'événement de modification ne fonctionne pas dans IE.

$('#radio_button').click(function(){
    // if ($(this).is(':checked')) alert('is checked'); 
    alert('check-checky-check was changed');
});

Maintenant, lorsque vous changez l'état de manière programmatique, vous devez également déclencher cet événement :

$('#radio_button').attr("checked", "checked");
$('#radio_button').click();

Answer 5

//Check through class

if($("input:radio[class='className']").is(":checked")) {
     //write your code         
}

//Check through name

if($("input:radio[name='Name']").is(":checked")) {
         //write your code         
}

//Check through data

if($("input:radio[data-name='value']").is(":checked")) {
         //write your code         
}