JQuery : Comment obtenir la valeur du bouton radio sélectionné ?

Question

Comment faire pour que la valeur par défaut d'un bouton radio non sélectionné soit la suivante 0 ?

J'ai le HTML suivant :

<input type="radio" name="myradiobutton" value="1" />1
<input type="radio" name="myradiobutton" value="2" />2
<input type="radio" name="myradiobutton" value="3" />3

Et j'ai le code suivant pour obtenir la valeur de l'élément sélectionné bouton radio

var radio_button_value $('input[name=myradiobutton]:radio').click(function() {var value = $(this).val();});

Le problème, c'est que je veux que la valeur par défaut de la fonction radio_button_value a 0 dans l'événement rien est sélectionné. Comment faire ?

Je veux essentiellement faire le code pseduo ci-dessous (mais cela ne fonctionne pas)

var radio_button_value $('input[name=myradiobutton]:radio').click(function() { 
if set
  return $(this).val();
else
  return 0;
});

UPDATE

Il semble y avoir une confusion sur ce que je demande.

Ce que je veux faire, c'est que lorsque la page se charge (avant même que l'utilisateur ait eu la possibilité de sélectionner un bouton radio), je veux une fonction qui renvoie 0 pour la valeur du bouton radio.

Ensuite, lorsqu'un utilisateur sélectionne un bouton radio, cette MEME fonction renvoie la valeur sélectionnée du bouton radio.

C'est logique ?

Answer 1

$('input[name=myradiobutton]:radio:checked') vous permettra d'obtenir le bouton radio sélectionné $('input[name=myradiobutton]:radio:not(:checked)') vous permettra d'obtenir les boutons radio non sélectionnés

En utilisant cela, vous pouvez faire ceci

$('input[name=myradiobutton]:radio:not(:checked)').val("0");

Mise à jour : Après avoir lu votre mise à jour, je pense avoir compris Vous voudrez faire quelque chose comme ceci

var myRadioValue;

function radioValue(jqRadioButton){
  if (jqRadioButton.length) {
    myRadioValue = jqRadioButton.val();
  }
  else {
    myRadioValue = 0;
  }
}

$(document).ready(function () {
  $('input[name=myradiobutton]:radio').click(function () {   //Hook the click event for selected elements
    radioValue($('input[name=myradiobutton]:radio:checked'));
  });

  radioValue($('input[name=myradiobutton]:radio:checked')); //check for value on page load
});

Answer 2

Utilisez le :vérifié pour déterminer si une valeur est sélectionnée :

function getRadioValue () {
    if( $('input[name=myradiobutton]:radio:checked').length > 0 ) {
        return $('input[name=myradiobutton]:radio:checked').val();
    }
    else {
        return 0;
    }
}

Mise à jour vous pouvez appeler la fonction ci-dessus à tout moment pour obtenir la valeur sélectionnée des boutons radio. Vous pouvez y accéder au chargement et ensuite à chaque fois que la valeur change avec les événements suivants :

$(document).ready( function() {
    // Value when you load the page for the first time
    // Will return 0 the first time it's called
    var radio_button_value = getRadioValue();

    $('input[name=myradiobutton]:radio').click( function() {
        // Will get the newly selected value
        radio_button_value = getRadioValue();
    });
}

Answer 3

Il démarrera dès que la page sera chargée. Vous pouvez le garder sous certains événements comme le clic sur un bouton.

$("#btn").click(function() { 
var val= $('input[type="radio"]:checked').val();
});

Answer 4

jQuery("input:radio[name=myradiobutton]:checked").val();

Answer 5

La meilleure méthode (en particulier si vous voulez être en mesure d'afficher une valeur par défaut), serait d'avoir un bouton radio caché qui commence comme sélectionné et a votre valeur par défaut. Quelque chose comme ceci :

<input type="radio" name="myradiobutton" value="0" checked="checked" style="display:none;" />
<input type="radio" name="myradiobutton" value="1" />1
<input type="radio" name="myradiobutton" value="2" />2
<input type="radio" name="myradiobutton" value="3" />3

Si vous ne pouvez pas modifier votre html directement, vous pourriez l'ajouter via script :

$(function() {
    $('input[name=myradiobutton]:radio:first').before('<input type="radio" name="myradiobutton" value="0" checked="checked" style="display:none;" />');
});

En voici une démonstration : http://jsfiddle.net/Ender/LwPCv/