Detailed explanation of examples of obtaining, assigning, and registering events for radio values ​​in HTML_HTML/Xhtml_Web page production

1. Radio grouping

As long as the name is the same, it is a group, that is, only one can be selected in a group, as follows:

Copy code

The code is as follows:

group1:
radio1
radio2
radio3

group2:
radio4
radio5
radio6

The effect is as follows:


2. Get the selected radio node

Using jquery can be very easy To make it easier, first select the group, and then filter out the checked ones, as follows:

Copy the code

The code is as follows :

var group1 = $("[name='group1']").filter(":checked");
console.log(group1.attr("id")) ;

3, select a radio node

Use jquery to set the checked attribute:

Copy code

The code is as follows:

$("#radio2").attr("checked", "checked");

4, go Select a radio node

to remove the checked attribute:

Copy the code

The code is as follows:

$("#radio1").removeAttr("checked");

The result of this may be that none of the radios in the group is selected.

5. Register the select and deselect event

Or use jquery’s on function to register the change event, as follows:

Copy the code

The code is as follows:

$("[name='group1']").on("change",
function (e) {
console.log($(e.target).val());
}
);

In this way, as long as any one in group1 is selected, it will trigger function.