Skip to main content
se añadieron 87 caracteres en el cuerpo
Origen Enlace
A. Cedano
  • 95.2k
  • 31
  • 145
  • 257

A. Con Javascript puro

Usando Javascript puro puedes obtener el valor de cualquiera de los radio seleccionados usando solo la etiqueta `name` que será la misma para todos. La función mostrada _escucha_ los cambios de todos los radios incluidos en el formulario cuyo id es `myForm`.

Es una forma sencilla de hacerlo, sin tener que estar agregando el evento onchange() a todos los radios, y sin tener que agregarles id, a no ser que necesites por algún motivo identificarlos de forma unívoca.

 var radios = document.forms["myForm"].elements["myRadio"];
      for(var i = 0, max = radios.length; i < max; i++) {
          radios[i].onclick = function() {
               alert(this.value);
      }
 }
 <form id="myForm">
      <input type="radio" name="myRadio" value="1" >1</input>
      <input type="radio" name="myRadio" value="2" >2</input>
      <input type="radio" name="myRadio" value="3" >3</input>
 </form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

A. Con Javascript puro

Usando Javascript puro puedes obtener el valor de cualquiera de los radio seleccionados usando solo la etiqueta `name` que será la misma para todos. La función mostrada _escucha_ los cambios de todos los radios incluidos en el formulario cuyo id es `myForm`.

Es una forma sencilla de hacerlo, sin tener que estar agregando el evento onchange() a todos los radios, y sin tener que agregarles id, a no ser que necesites por algún motivo identificarlos de forma unívoca.

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

A. Con Javascript puro

Usando Javascript puro puedes obtener el valor de cualquiera de los radio seleccionados usando solo la etiqueta `name` que será la misma para todos. La función mostrada _escucha_ los cambios de todos los radios incluidos en el formulario cuyo id es `myForm`.

Es una forma sencilla de hacerlo, sin tener que estar agregando el evento onchange() a todos los radios, y sin tener que agregarles id, a no ser que necesites por algún motivo identificarlos de forma unívoca.

 var radios = document.forms["myForm"].elements["myRadio"];
      for(var i = 0, max = radios.length; i < max; i++) {
          radios[i].onclick = function() {
               alert(this.value);
      }
 }
 <form id="myForm">
      <input type="radio" name="myRadio" value="1" >1</input>
      <input type="radio" name="myRadio" value="2" >2</input>
      <input type="radio" name="myRadio" value="3" >3</input>
 </form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

se añadieron 474 caracteres en el cuerpo
Origen Enlace
A. Cedano
  • 95.2k
  • 31
  • 145
  • 257

A. Con Javascript puro

Usando Javascript puro puedes obtener el valor de cualquiera de los radio seleccionados usando solo la etiqueta `name` que será la misma para todos. La función mostrada _escucha_ los cambios de todos los radios incluidos en el formulario cuyo id es `myForm`.

Es una forma sencilla de hacerlo, sin tener que estar agregando el evento onchange() a todos los radios, y sin tener que agregarles id, a no ser que necesites por algún motivo identificarlos de forma unívoca.

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

A. Con Javascript puro

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

A. Con Javascript puro

Usando Javascript puro puedes obtener el valor de cualquiera de los radio seleccionados usando solo la etiqueta `name` que será la misma para todos. La función mostrada _escucha_ los cambios de todos los radios incluidos en el formulario cuyo id es `myForm`.

Es una forma sencilla de hacerlo, sin tener que estar agregando el evento onchange() a todos los radios, y sin tener que agregarles id, a no ser que necesites por algún motivo identificarlos de forma unívoca.

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

se añadieron 697 caracteres en el cuerpo
Origen Enlace
A. Cedano
  • 95.2k
  • 31
  • 145
  • 257

A. Con Javascript puro

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

A. Con Javascript puro

var radios = document.forms["myForm"].elements["myRadio"];
for(var i = 0, max = radios.length; i < max; i++) {
radios[i].onclick = function() {
    alert(this.value);
}
}
<form id="myForm">
<input type="radio" name="myRadio" value="1" >1</input>
<input type="radio" name="myRadio" value="2" >2</input>
<input type="radio" name="myRadio" value="3" >3</input>
</form>

B. Con jQuery

Para obtener el valor del radio seleccionado.

Suponiendo que los radio tienen en la etiqueta name el valor radioName y que se encuentran en un formulario cuyo id es myForm, puedes hacerlo simplemente así:

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

$('#myForm input').on('change', function() {
  alert($('input[name=radioName]:checked', '#myForm').val());
});
<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>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Si no tienes un formulario, puedes asignar el listener al elemento <body> del DOM.

Ejemplo:

$('body').on("change", "input[name='radioName']", function() {
  var $value= $("input[name='radioName']:checked").val();
  alert($value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <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 />

se añadieron 697 caracteres en el cuerpo
Origen Enlace
A. Cedano
  • 95.2k
  • 31
  • 145
  • 257
Loading
Origen Enlace
A. Cedano
  • 95.2k
  • 31
  • 145
  • 257
Loading