web-dev-qa-db-fra.com

groupe de boutons radio jQuery. Méthode de changement

Je travaille avec un formulaire avec un bouton radio qui fait partie d'un ensemble de radios et un seul peut être sélectionné à la fois (pas de problème avec la sélection unique). Une de ces radios doit émettre un code chaque fois qu’elle sélectionne un code différent lorsqu’elle est désélectionnée (une autre radio est sélectionnée), utilise la méthode .change et déclenche le code lorsque vous cliquez dessus, mais pas quand elle perd la sélection. Ce que je veux, c'est basculer ou pouvoir savoir quand il perd la sélection.

Je pourrais le faire en ajoutant du code à la méthode .change des autres radios, mais il existe de nombreux ensembles de radios et ce serait douloureux. Je recherche une configuration unique.

Modifier

Le balisage est constitué du moteur ASP MVC Razor, comme suit:

@Html.RadioButtonFor(x => x.SomeModel, new { @class = "special-radio" })
@* Other radios but without the 'specia-radio' class *@

js:

// logging
$(function(){
  $('.special-radio').change(function(){
    console.log('change');
  });
});

Le changement de chaîne n'apparaît que lorsque vous cliquez sur la radio "radio spéciale".

12
loki

Vous pouvez le faire en utilisant change event on radio group de cette façon,

vérifier cette question,

Surveillance lorsqu'un bouton radio n'est pas coché

4
maximus ツ

Aucun événement n'est déclenché lorsqu'une radio est décochée, car elle serait redondante. Essayez ceci à la place:

http://jsfiddle.net/hmartiro/g4YqD/1/

Il place un événement de changement sur l’ensemble des radios et déclenche un événement si la radio sélectionnée est spéciale et un autre événement dans le cas contraire.

3
hayk.mart

Si l'ajout d'une classe pour n'est pas possible. Vous pouvez utiliser un conteneur avec un identifiant pour ces boutons radio. De cette façon, vous pouvez isoler l'événement change. DEMO FIDDLE

var prev_data;
$('#special_radios input').change(function(){
    var me = $(this);
    //running function for check
  $('#log').html('<p>firing event for check: '+ me.attr('id') +'</p>');
    if(prev_data)
      uncheck_method(prev_data);  
  prev_data = me;
});

//@param obj = jquery raidio object
function uncheck_method(obj){
    $('#log').append('<p>firing event for uncheck: '+obj.attr('id')+'</p>');
    obj.prop('checked', false) 
    //console.log($('#special_radios input:checked'));
}

​

html

<input type="radio" name="zz" id="5"/>
<div id="special_radios">
   <input type="radio" name="rx" id="1"/>
   <input type="radio" name="ry"  id="2" />
   <input type="radio" name="rz" id="3"/>
   <input type="radio" name="ra"  id="4"/>
</div>
<div id="log"></div>
​
2
Bob

Solution simple

var newValue; // vale of checked radio button
var oldValue; // value of unchecked radio button

$('.special-radio').change(function(){
    oldValue = newValue;
    newValue = $(this).val();
});

Si oldValue et newValue sont identiques, cela signifie que l'option n'a pas été décochée.

0
Naween Niroshan