Detailed explanation of jQuery setting radio button radio selection and deselection examples

This article mainly introduces the relevant information of jQuerySettingsRadio buttonradio selected/unavailable example code. It is very good and has reference value. Friends who need it can Please refer to the following

Because this part is "Daily Use of jQuery", it is based on specific needs and summarizes the knowledge points that need to be used. The code may not be well written, as long as it achieves the goal. So let’s first take a look at the requirements this time: the color block mode is based on the color mode, that is, the color block can be turned on when the color is turned on. The color block is not available when the color is turned off. The color block radio is available when the color is turned on. When the color is turned off, if the color block If the block is on, you need to turn it off, and that's about it.

Let's take a look at the demonstration effect first:

Let's take a look at jQuery's operation of the radio button radio.

1. The color block is not available when the color is turned off.

requires two steps. When the page is opened, detect if the color is turned off. Make the "on" of the color block unavailable:

if($("#coloroff[checked]"))
{
//alert("Hello Nowamagic!");
$("#blockon").attr("disabled", true);
}

In addition, when the color switch is switched, that is, when switching from on to off, make the color block on unavailable, and select the color block off at the same time:

$("#coloroff").change(function(){
$("#blockon").attr("disabled", true);
$("#blockoff").attr("checked",true);
})

2. Make the color block available when the color is switched from off, this is simple:

$("#coloron").change(function(){
$("#blockon").attr("disabled", false);
})

The full code is:

$(document).ready(function(){
if($("#coloroff[checked]"))
{
//alert("Hello Nowamagic!");
$("#blockon").attr("disabled", true);
}
$("#coloroff").change(function(){
$("#blockon").attr("disabled", true);
$("#blockoff").attr("checked",true);
})
$("#coloron").change(function(){
$("#blockon").attr("disabled", false);
})
});

Add a few knowledge points:

checkbox, radio These controls have no readonlyattribute, so you need to use disabled Properties to toggle their "available/unavailable" status.

To set the radio to be unavailable, you can use the attr() method, that is, attr("disabled", true).

Setting the selected status of radio also uses the attr() method, attr("checked",true).

The above is the detailed content of Detailed explanation of jQuery setting radio button radio selection and deselection examples. For more information, please follow other related articles on the PHP Chinese website!