JQuery control Radio selection method analysis

JQuery control Radio selection method analysis_jquery

WBOY

Release： 2016-05-16 15:57:17

Original

1242 people have browsed it

The example in this article describes the JQuery control Radio selection method. Share it with everyone for your reference. The details are as follows:

Method 1:

$(function () { 
  $("#spanNan").click(function () { 
  $("#Radio1").attr("checked", true); 
  $("#Radio2").attr("checked", false); 
  });
  $("#spanNv").click(function () {
  $("#Radio2").attr("checked", true);
  $("#Radio1").attr("checked", false);
  });
})

Copy after login

Method 2: (Simple method)

$(function () {
  $("#spanNan").click(function () {
  //$("#Radio1").attr("checked", true);
  //$("#Radio2").attr("checked", false);
  $("#Radio1").click();
  });
  $("#spanNv").click(function () {
  //$("#Radio2").attr("checked", true);
  //$("#Radio1").attr("checked", false);
  $("#Radio2").click();
  });
})

Copy after login

<input id="Radio2" type="radio" name="sex"/>
<label for="Radio2">女</label>

Copy after login

Summary:

If you want to implement radio selection in the HTML Radio control, such as the selection of men and women in this example, you need to add a name attribute to Radio with the same value; for example: name="sex".

Radio is selected by default:

jQuery(document).ready(function(){
  $("input[name=targetBlank]:eq(0)").attr("checked",'checked');
  $("input[name=status]:eq(0)").attr("checked",'checked');
});

Copy after login

Use jquery to get the value of radio. The most important thing is to master the use of jquery selector. In a form, we usually want to get the value of the selected radio item, so we need to add checked to filter. For example, there are the following Some radio items:

1.jquery gets the value of radio
2.jquery gets the value of the checkbox
3.jquery gets the value of select

To get the value of a certain radio, there are the following methods, just give the code directly:

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

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

$('input[@name="testradio"][checked]');

$('input[name="testradio"]').filter(':checked');

Copy after login

It’s almost complete. What if we want to traverse all radios named testradio? The code is as follows

$('input[name="testradio"]').each(function(){alert(this.value);});

If you want to get the value of a specific radio, such as the value of the second radio, write like this

<script type="text/javascript">
$(document).ready(function(){
  $("input[@type=radio][name=sex][@value=1]").attr("checked",true);
}); 
</script>

Copy after login

Your gender:

<input type="radio" name="sex" value="1" <s:if test="user.sex==1">checked</s:if>/>男 
<input type="radio" name="sex" value="0" <s:if test="user.sex==0">checked</s:if>/>女

Copy after login

I hope this article will be helpful to everyone’s jQuery programming.