jquery- selector para analizar todos los elementos de un botón de radio específico o casilla de verificación

I am trying to parse through all elements in a single radio button (or check box). In my code, $(this) refers to a specific radio button or checkbox...

What I want is to create a function using 'each' which parses through all values of a radio or check box..

The code I am trying to create is shown below--

...SOME CODE....
...SOME CODE....
else if (($(this).attr('type')=="radio")||($(this).attr('type')=="checkbox"))
                $(this).<WHAT SHOULD BE THE CODE HERE>.each(function(){ 

                        alert( " Option value=" + $(this).val() );    


What should be the code at the place indicated above, so that I can parse through all elements of a radio button/check box. Also, I want to obtain both text values and assigned values, I suppose this can be done using text() and val() respectively?


 <input type="checkbox" name="color" value="red1">

<input type="checkbox" name="color" value="yellow1">

<input type="checkbox" name="color" value="blue1">

<input type="checkbox" name="color" value="orange1">

<input type="checkbox" name="color" value="green1">

 <input type="checkbox" name="color" value="purple1">

As can be seen from above example, for each element of the checkbox, using val() should fetch "red1", "yellow1", "blue1" and so on...while using text() should fetch "Red" "Yellow" "Blue" and so on...

preguntado el 08 de noviembre de 11 a las 12:11

Do you want to, for each radiobutton or checkbox, traverse the other radiobuttons/checkboxes with the same name attribute? -

How can a radio/checkbox have multiple values. Please rewrite and signify your question and let me know! -

@Jørgen I want to travers each element of a single radiobutton or checkbox at a time. Please refer the example I have given in the question... -

@MunimAbdul please refer the question- I have added an example of what I want to obtain... -

3 Respuestas

$('input[type="checkbox"], input[type="radio"]').each(function(){
  $('[name="' + $(this).prop('name') + '"]').each(function(){ 
    // Do stuff here with $(this).val();
    // Should be red1, yellow1, blue1, ...

respondido 08 nov., 11:16

I want to put your code inside the loop as I have given in the question... in place of the first line of your code, can i use $(this) (The $(this) refers to the current element... I have already checked that this element is a check box or radio button)... Thanks... - Arvind

You can switch $(this).<WHAT SHOULD BE THE CODE HERE> with $('[name="' + $(this).prop('name') + '"]') then, and ignore the rest :) - Jørgen

Why not change the HTML to read:

<input type="checkbox" name="color" value="red1"/><span>Red</span><br />
<input type="checkbox" name="color" value="yellow1"/><span>Yellow</span><br />
<input type="checkbox" name="color" value="blue1"/><span>Blue</span><br />
<input type="checkbox" name="color" value="orange1"/><span>Orange</span><br />
<input type="checkbox" name="color" value="green1"/><span>Green</span><br />
<input type="checkbox" name="color" value="purple1"/><span>Purple</span><br />

Then read in the .next('span').

alert( " Value=" + $(this).val() + " Text: " + $(this).next('span').text());

I guess you could do the same with your Radio's

respondido 08 nov., 11:16

@Jeggs- the problem is that I am trying to collect info about 3rd party sites forms...so i cannot change the html... thanks anyway for your help - Arvind

Even better: You should wrap it in label elements. You'd get the value with $(this).val() and the text with $(this).parent().text(); - Jørgen

How about this solution for finding input values / text pairs:

 var inputs = document.getElementsByTagName('input'), text, value;
 for(var i = 0, l=inputs.length;i<l;++i){
    if(inputs[i].type != 'checkbox'&&inputs[i].type != 'radio'){
      text = inputs[i].nextSibling.nodeValue;
      value = inputs[i].value;

respondido 08 nov., 11:17

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.