0

JSFiddle: http://jsfiddle.net/dvF5d/2/

<input type="radio" id="rad1" name="rad"/><label for="rad1">rad1</label><br/>
<input type="checkbox" id="chk1"/><label for="chk1">chk1</label><br/>
<input type="radio" id="rad2" name="rad"/><label for="rad2">rad2</label>

 $(document).ready(function(){
  var rad1 = $('#rad1');
  var chk1 = $('#chk1');
    var a =  function(){
        if(!rad1.is(':checked'))
        {
           chk1.attr('disabled', true);
        }
        console.log('rad checked', rad1.is(':checked'));
    };
    rad1.blur(function(){
        console.log('blur');
         a();     
    });
    rad1.change(function(){
        console.log('change');
        a();
    });
});

When rad1 is blurred, the rad1 is checked property is always true even if rad2 is selected. Is there anyway to fix this? (or better yet, some kind of jquery plugin that enables/disables controls based on other controls).

4

3 に答える 3

1

There is no such thing as blur in terms of a radio button, the only circumstance that would cause unchecking the radio button, is checking another one. So change your blur to be:

$("input[type='radio']:not(#rad1)").change(function(){
    //rad1 isn't checked
});

Demo: http://jsfiddle.net/dvF5d/4/

于 2012-05-04T16:55:13.837 に答える
0

To toggle the checkbox based on the radio selection:

jQuery(function(){
    var $rad1 = $('#rad1');
    var $checkbox = $('#chk1');

    $('input[type="radio"]').click(function(){
        $checkbox.prop('disabled', !$rad1.is(':checked'));
    });
});​
于 2012-05-04T16:50:46.573 に答える
0

I know you've already selected an answer, however based on your comment, "When rad1 is selected, chk1 should be enabled. When rad2 is selected, chk1 should be disabled." the following would do what you said:

​$('input[name="rad"]').change(function(){
    $('#chk1').attr('disabled',$('#rad2').is(':checked'));
});​​​​​​​​​​​​​

jsFiddle example.

于 2012-05-04T17:02:20.190 に答える