JQuery $ (# radioButton) .change (…) pas de tir pendant la sélection

On dirait que la fonction change() n'est appelée que lorsque vous cochez un bouton radio, et non pas lorsque vous le décocher. La solution que j'ai utilisée est de lier l'événement de changement à chaque bouton radio:

 $("#r1, #r2, #r3").change(function () { 

Ou vous pouvez donner à tous les boutons radio le même nom:

 $("input[name=someRadioGroup]:radio").change(function () { 

Voici un exemple de jsfiddle en cours d' exécution (mis à jour par le commentaire de Chris Porter).

Le commentaire de Per @ Ray, vous devriez éviter d'utiliser des noms . En eux. Ces noms fonctionnent dans jQuery 1.7.2 mais pas dans d'autres versions ( exemple jsfiddle ).

 <input id='r1' type='radio' class='rg' name="asdf"/> <input id='r2' type='radio' class='rg' name="asdf"/> <input id='r3' type='radio' class='rg' name="asdf"/> <input id='r4' type='radio' class='rg' name="asdf"/><br/> <input type='text' id='r1edit'/> 

Jquery part

 $(".rg").change(function () { if ($("#r1").attr("checked")) { $('#r1edit:input').removeAttr('disabled'); } else { $('#r1edit:input').attr('disabled', 'disabled'); } }); 

Voici la DEMO

Vous pouvez lier à tous les boutons radio par nom:

 $('input[name=someRadioGroup]:radio').change(...); 

Exemple de travail ici: http://jsfiddle.net/Ey4fa/

Cela fonctionne normalement pour moi:

if ($("#r1").is(":checked")) {}

Mon problème était similaire et cela a fonctionné pour moi:

 $('body').on('change', '.radioClassNameHere', function() { ... 

Avec Ajax, pour moi travaillé:

Html:

 <div id='anID'> <form name="nameOfForm"> <p><b>Your headline</b></p> <input type='radio' name='nameOfRadio' value='seed' <?php if ($interviewStage == 'seed') {echo" checked ";}?> onchange='funcInterviewStage()'><label>Your label</label><br> </form> </div> 

Javascript:

  function funcInterviewStage() { var dis = document.nameOfForm.nameOfRadio.value; //Auswahltafel anzeigen if (dis == "") { document.getElementById("anID").innerHTML = ""; return; } else { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.getElementById("anID").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET","/includes/[name].php?id="+dis,true); xmlhttp.send(); } } 

Et php:

 //// Get Value $id = mysqli_real_escape_string($db, $_GET['id']); //// Insert to database $insert = mysqli_query($db, "UPDATE [TABLE] SET [column] = '$id' WHERE [...]"); //// Show radio buttons again $mysqliAbfrage = mysqli_query($db, "SELECT [column] FROM [Table] WHERE [...]"); while ($row = mysqli_fetch_object($mysqliAbfrage)) { ... } echo" <form name='nameOfForm'> <p><b>Your headline</b></p> <input type='radio' name='nameOfRadio' value='seed'"; if ($interviewStage == 'seed') {echo" checked ";} echo" onchange='funcInterviewStage()'><label>Yourr Label</label><br> <input type='radio' name='nameOfRadio' value='startup'"; if ($interviewStage == 'startup') {echo" checked ";} echo" onchange='funcInterviewStage()'><label>Your label</label><br> </form> "; 

Disons que ces boutons radio sont à l'intérieur d'un div qui a les radioButtons identification et que les boutons radio ont le même nom (par exemple nom commonName ) alors:

 $('#radioButtons').on('change', 'input[name=commonName]:radio', function (e) { console.log('You have changed the selected radio button!'); }); 

L'événement de change qui ne déclenche pas la désélection est le comportement souhaité. Vous devez exécuter un sélecteur sur l'ensemble du groupe de radio plutôt que simplement le bouton radio unique. Et votre groupe de radio devrait avoir le même nom (avec des valeurs différentes)

Considérez le code suivant:

 $('input[name="job[video_need]"]').on('change', function () { var value; if ($(this).val() == 'none') { value = 'hide'; } else { value = 'show'; } $('#video-script-collapse').collapse(value); }); 

J'ai le même cas d'utilisation que le vôtre, c'est-à-dire montrer une boîte de saisie lorsqu'un bouton radio particulier est sélectionné. Si l'événement a également été déclenché lors de la sélection, j'aurais 2 événements à chaque fois.

Le même problème ici, cela a bien fonctionné:

 $('input[name="someRadioGroup"]').change(function() { $('#r1edit:input').prop('disabled', !$("#r1").is(':checked')); });