jQuery基于样式类名称查找所有单选输入的方法

Question

I'm using the below javascript function to get all the radio buttons on my page and clear them. The problem is I don't want to clear all of them. Is there a way to just clear a group of them? I think the only way I can logically group them (since they're dynamically generated by server side mappings) is to give all the ones I want unchecked a common style class name and search that way. Any ideas on how to modify the below such that it only finds certain radio buttons who have a certain style class name? align-top is my styleClass name.

<script type="text/javascript">
       function clearOtherSelections(selRow){
           var radios = jQuery('td > input[type=radio]');
           radios.attr('checked', false);
           selRow.checked = 'checked';                   
       }
</script>

When I used the revised code below, var radios = jQuery('.align-top'); alerts that all the radios are unchecked which is untrue. When I use my old way var radios = jQuery('td > input[type=radio]'); it shows one radio checked an the others not, which is correct. Why doesn't jQuery('.align-top'); show an accurate state of the radio checked poperty?

revised code:

function clearOtherSelections(selRow){
                        //var radios = jQuery('td > input[type=radio]');
                        var radios = jQuery('.align-top');                        
                        for( i = 0; i < radios.length; i++ ) {
                            if( radios[i].checked ) {
                                alert('checked')
                                radios.attr('checked', false);
                            }else{
                                alert('unchecked')
                            }
                        }

                        selRow.checked = 'checked';                    
                    }

Answer 1

I'd suggest:

function clearOtherSelections(selRow){
    var radios = jQuery('td > input.specificClassName:radio');
    radios.prop('checked', false);
    selRow.checked = 'checked';                   
}

You're setting the checked property , rather than the attribute , so use the prop() method, rather than attr() .

If the class will only be applied to the specific input elements you want to style, you might be able to use, simply:

var radios = jQuery('.specificClassName');

or:

var radios = jQuery('input.specificClassName');

References:

• prop() .
• :radio selector .

Answer 2

Try this:

<script type="text/javascript">
       function clearOtherSelections(selRow){
           var radios = jQuery('td > input[type=radio].someclass');
           radios.prop('checked', false);
           selRow.checked = 'checked';                   
       }
</script>

Answer 3

You can use :radio selector, which comes along with jQuery library, and it is more faster as compare to input[type=radio].

$("td > input:radio.yourClass") // Gives you all the radio button which has yourClass

jQuery : radio selector