Uncheck the checked state of a radio button using jQuery

WBOY
Release: 2024-01-17 09:33:22
forward
438 people have browsed it

Uncheck the checked state of a radio button using jQuery

jquery clear radio selected state

When closing the window: $("input[type='radio']").removeAttr('checked').

Jquery common methods

1. References to page elements.

You can reference elements by using jQuery's $() method, and select through id, class, element name, hierarchical relationship, DOM or XPath conditions, etc. What is returned is a jQuery object (collection object), and methods defined by the DOM cannot be called directly.

2. Conversion of jQuery object and dom object.

Methods defined by jQuery can only be called using jQuery objects. Be aware of the difference between DOM objects and jQuery objects, and make sure you are operating on the correct object when calling methods.

3. How to get an item of jQuery collection.

For the obtained element collection, to obtain an item (specified by index), you can use the eq or get(n) method or the index number. Note that eq returns a jquery object, and get(n) and The index returns the dom element object. For jquery objects, you can only use jquery methods, and for dom objects, you can only use dom methods, such as getting the content of the third element.

4. Collection processing function.

For the collection content returned by jquery, we do not need to loop through it ourselves and process each object separately. jquery has provided us with a very convenient method to process the collection. Includes two forms: $("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][i]})

5. Several practical special effects functions.

The toggle() and slidetoggle() methods provide the status switching function.

For example, the toggle() method includes the hide() and show() methods.

slideToggle() method includes slideDown() and slideUp methods.

6. Complete event processing function

Jquery has provided us with various event handling methods. We do not need to write events directly on html elements, but can directly add events to objects obtained through jquery.

How to use jquery to select radio buttons

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 checkbox

3.jquery gets the value of select

If you want to get the value of a certain radio, there are several methods as follows, just give the code directly:

1,

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

1.$('input:radio:checked').val();3、

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

1.$('input[name="testradio"]').filter(':checked'); It's almost complete. If we want to traverse all radios with the name testradio, the code is as follows

1.$('input[name="testradio"]').each(function(){2.alert(this.value);3.}); If you want to get the value of a specific radio, for example The value of the second radio is written like this

1.$('input[name="testradio"]:eq(1)').val()

Javascript controls the display of the text box by selecting the radio button

html is as follows:

show

hide

JS is as follows:

var show = document.getElementById('show'); // Get the corresponding elements respectively

var hide = document.getElementById('hide');

var text = document.getElementById('text');

show.onclick = function() {

text.style.display = '';

};

hide.onclikc = function() {

text.style.diplay = 'none';

}

The above is the detailed content of Uncheck the checked state of a radio button using jQuery. For more information, please follow other related articles on the PHP Chinese website!

source:docexcel.net
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template