Hoe weet ik welk keuzerondje is geselecteerd via jQuery?

Ik heb twee keuzerondjes en wil de waarde van de geselecteerde posten.
Hoe krijg ik de waarde met jQuery?

Ik kan ze allemaal zo krijgen:

$("form :radio")

Hoe weet ik welke is geselecteerd?


Antwoord 1, autoriteit 100%

Om de waarde van het geselecteerderadioNameitem van een formulier met id myFormte verkrijgen:

$('input[name=radioName]:checked', '#myForm').val()

Hier is een voorbeeld:

$('#myForm input').on('change', function() {
   alert($('input[name=radioName]:checked', '#myForm').val()); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
  <input type="radio" name="radioName" value="1" /> 1 <br />
  <input type="radio" name="radioName" value="2" /> 2 <br />
  <input type="radio" name="radioName" value="3" /> 3 <br />
</form>

Antwoord 2, autoriteit 11%

Gebruik dit..

$("#myform input[type='radio']:checked").val();

Antwoord 3, autoriteit 8%

Als je al een verwijzing naar een groep met keuzerondjes hebt, bijvoorbeeld:

var myRadio = $("input[name=myRadio]");

Gebruik de filter()-functie, niet find(). (find()is voor het lokaliseren van kinderen / afstammelingen elementen, terwijl filter()op het hoogste niveau-elementen in uw selectie zoekt.)

var checkedValue = myRadio.filter(":checked").val();

OPMERKINGEN: Dit antwoord corrigeerde oorspronkelijk een ander antwoord dat wordt aanbevolen met behulp van find(), die sindsdien is gewijzigd. find()kan nog steeds nuttig zijn voor de situatie waarin u al een verwijzing naar een containerelement had, maar niet op de keuzerondjes, b.v.:

var form = $("#mainForm");
...
var checkedValue = form.find("input[name=myRadio]:checked").val();

Antwoord 4, Autoriteit 4%

Dit zou moeten werken:

$("input[name='radioName']:checked").val()

Let op het “” opgenomen rond de ingang: gecontroleerd en niet ” zoals de oplossing van Peter J


Antwoord 5, Autoriteit 2%

U kunt de: Checked Selector samen met de radioselector gebruiken.

$("form:radio:checked").val();

Antwoord 6, Autoriteit 2%

Als u alleen de Booleaanse waarde wilt, d.w.z. als het wordt gecontroleerd of dit niet probeert:

$("#Myradio").is(":checked")

Antwoord 7

Krijg alle radio’s:

var radios = jQuery("input[type='radio']");

Filter om degene te krijgen die is gecontroleerd

radios.filter(":checked")

Antwoord 8

Een andere optie is:

$('input[name=radioName]:checked').val()

Antwoord 9

$("input:radio:checked").val();

Antwoord 10

In mijn geval heb ik twee radioknoppen in één formulier en ik wilde de status van elke knop kennen.
Hieronder werkte voor mij:

// get radio buttons value
console.log( "radio1: " +  $('input[id=radio1]:checked', '#toggle-form').val() );
console.log( "radio2: " +  $('input[id=radio2]:checked', '#toggle-form').val() );
    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="toggle-form">
  <div id="radio">
    <input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1">Plot single</label>
    <input type="radio" id="radio2" name="radio"/><label for="radio2">Plot all</label>
  </div>
</form>

Antwoord 11

Hier is hoe ik het formulier zou schrijven en het krijgen van de ingecheckte radio.

Een formulier met behulp van de naam MYFORM:

<form id='myForm'>
    <input type='radio' name='radio1' class='radio1' value='val1' />
    <input type='radio' name='radio1' class='radio1' value='val2' />
    ...
</form>

Haal de waarde op uit het formulier:

$('#myForm .radio1:checked').val();

Als u het formulier niet plaatst, zou ik het verder vereenvoudigen door het volgende te gebruiken:

<input type='radio' class='radio1' value='val1' />
<input type='radio' class='radio1' value='val2' />

Dan wordt het verkrijgen van de aangevinkte waarde:

   $('.radio1:checked').val();

Als ik een klassenaam op de invoer heb, kan ik de invoer gemakkelijk stylen…


Antwoord 12

In een JSFgegenereerd keuzerondje (met behulp van de <h:selectOneRadio>tag), kunt u dit doen:

radiobuttonvalue = jQuery("input[name='form_id\:radiobutton_id']:checked").val();

waarbij selectOneRadio ID radiobutton_idis en formulier-ID form_idis.

Zorg ervoor dat u namegebruikt in plaats van id, zoals aangegeven, omdat jQuery dit kenmerk gebruikt (namewordt automatisch gegenereerd door JSF die lijkt op de controle-ID ).


Antwoord 13

Controleer ook of de gebruiker niets selecteert.

var radioanswer = 'none';
if ($('input[name=myRadio]:checked').val() != null) {           
   radioanswer = $('input[name=myRadio]:checked').val();
}

Antwoord 14

Als u meerdere keuzerondjes in een enkel formulier hebt, dan

var myRadio1 = $('input[name=radioButtonName1]');
var value1 = myRadio1.filter(':checked').val();
var myRadio2 = $('input[name=radioButtonName2]');
var value2 = myRadio2.filter(':checked').val();

Dit werkt voor mij.


Antwoord 15

Ik heb een jQuery-plug-in geschreven voor het instellen en verkrijgen van radioknopwaarden. Het respecteert ook de gebeurtenis “verandering” op hen.

(function ($) {
    function changeRadioButton(element, value) {
        var name = $(element).attr("name");
        $("[type=radio][name=" + name + "]:checked").removeAttr("checked");
        $("[type=radio][name=" + name + "][value=" + value + "]").attr("checked", "checked");
        $("[type=radio][name=" + name + "]:checked").change();
    }
    function getRadioButton(element) {
        var name = $(element).attr("name");
        return $("[type=radio][name=" + name + "]:checked").attr("value");
    }
    var originalVal = $.fn.val;
    $.fn.val = function(value) {
        //is it a radio button? treat it differently.
        if($(this).is("[type=radio]")) {
            if (typeof value != 'undefined') {
                //setter
                changeRadioButton(this, value);
                return $(this);
            } else {
                //getter
                return getRadioButton(this);
            }
        } else {
            //it wasn't a radio button - let's call the default val function.
            if (typeof value != 'undefined') {
                return originalVal.call(this, value);
            } else {
                return originalVal.call(this);
            }
        }
    };
})(jQuery);

Plaats de code ergens om de invoegtoepassing in te schakelen. Geniet dan! Het overschrijft gewoon de standaard val-functie zonder iets te breken.

Je kunt deze jsFiddle bezoeken om het in actie te proberen en te zien hoe het werkt.

Fiddle


Antwoord 16

$(".Stat").click(function () {
     var rdbVal1 = $("input[name$=S]:checked").val();
 }

Antwoord 17

Dit werkt prima

$('input[type="radio"][class="className"]:checked').val()

Werkdemo

De :checkedselector werkt voor checkboxes, radio buttons, en select-elementen. Gebruik alleen voor geselecteerde elementen de :selectedselector.

API voor :checked Selector


Antwoord 18

Om de waarde te krijgen van de geselecteerde radio die een klasse gebruikt:

$('.class:checked').val()

Antwoord 19

Ik gebruik dit eenvoudige script

$('input[name="myRadio"]').on('change', function() {
  var radioValue = $('input[name="myRadio"]:checked').val();        
  alert(radioValue); 
});

Antwoord 20

Gebruik dit:

value = $('input[name=button-name]:checked').val();

Antwoord 21

DEMO: https://jsfiddle.net/ipsjolly/xygr065w/

	$(function(){
	    $("#submit").click(function(){      
	        alert($('input:radio:checked').val());
	    });
	 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
       <tr>
         <td>Sales Promotion</td>
         <td><input type="radio" name="q12_3" value="1">1</td>
         <td><input type="radio" name="q12_3" value="2">2</td>
         <td><input type="radio" name="q12_3" value="3">3</td>
         <td><input type="radio" name="q12_3" value="4">4</td>
         <td><input type="radio" name="q12_3" value="5">5</td>
      </tr>
    </table>
<button id="submit">submit</button>

Antwoord 22

Als je maar 1 set keuzerondjes op 1 formulier hebt, is de jQuery-code zo simpel als dit:

$( "input:checked" ).val()

Antwoord 23

Ik heb een bibliotheek uitgebracht om hierbij te helpen. Haalt eigenlijk alle mogelijke invoerwaarden op, maar geeft ook aan welk keuzerondje is aangevinkt. Je kunt het bekijken op https://github.com/mazondo/formalizedata

Het geeft je een js-object van de antwoorden, dus een vorm als:

<form>
<input type="radio" name"favorite-color" value="blue" checked> Blue
<input type="radio" name="favorite-color" value="red"> Red
</form>

geeft je:

$("form").formalizeData()
{
  "favorite-color" : "blue"
}

Antwoord 24

JQuery om alle keuzerondjes in het formulier en de aangevinkte waarde te krijgen.

$.each($("input[type='radio']").filter(":checked"), function () {
  console.log("Name:" + this.name);
  console.log("Value:" + $(this).val());
});

Antwoord 25

Gebruik de volgende jQuery-code om alle waarden van keuzerondjes in de JavaScript-array op te halen:

var values = jQuery('input:checkbox:checked.group1').map(function () {
    return this.value;
}).get();

Antwoord 26

probeer het-

var radioVal = $("#myform").find("input[type='radio']:checked").val();
console.log(radioVal);

Antwoord 27

Een andere manier om het te krijgen:

$("#myForm input[type=radio]").on("change",function(){
   if(this.checked) {
    alert(this.value);
    }
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
   <span><input type="radio" name="q12_3" value="1">1</span><br>
   <span><input type="radio" name="q12_3" value="2">2</span>
</form>

Antwoord 28

$(function () {
// Someone has clicked one of the radio buttons
var myform= 'form.myform';
$(myform).click(function () {
    var radValue= "";
    $(this).find('input[type=radio]:checked').each(function () {
        radValue= $(this).val();
    });
  })
});

Antwoord 29

Probeer

myForm.myOption.value

Antwoord 30

probeer deze eens.
het werkte voor mij

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

Other episodes