Trigger change event of a checkbox

问题

I've 7 checkboxes (A,B,C,D,E,F,G) and when I click one of them, the value is appended to a textarea. If I uncheck one, the value is removed from the textarea. The jquery code is as below:

var checkboxes = $("input[type='checkbox']");

checkboxes.on('change', function() {
    $('#recipient').val(
        checkboxes.filter(':checked').map(function(item) {
            return this.value;
    }).get().join('; ')
 );
});

The html code is as below:

<div class="col-sm-5">        
        <div class="form-group">
            <label>Recipient</label>
            <textarea class="form-control" rows="5" id="recipient"></textarea>
        </div>           
        <div class="form-group">
            <label>Message</label>
            <textarea class="form-control" rows="5"></textarea>
        </div>            
        <button type="submit" class="btn btn-default">Submit</button>
        <button type="reset" class="btn btn-default">Reset</button>        
    </div>
<div class="col-sm-5">
        <label>&nbsp;</label>
        <div class="col-sm-12">  
            <div class="panel panel-primary">
                <div class="panel-heading"> 
                    <h3 class="panel-title">Address Book</h3> 
                </div>
                <div class="panel-body">
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="member" value="A">A
                        </label>
                    </div>
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="member" value="B">B
                        </label>
                    </div>
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="firm" value="C">C
                        </label>
                    </div>
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="firm" value="D">D
                        </label>
                    </div>
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="firm" value="E">E
                        </label>
                    </div>
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="firm" value="F">F
                        </label>
                    </div>   
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" class="firm" value="G">G
                        </label>
                    </div>
                </div>
            </div>  
        </div>
    </div>

Now, here is a situation where when I click on Checkbox "C", the following checkboxes D,E,F,G should be disabled as well as if anyone of those checkboxes are already in checked state then it should uncheck and trigger the on change event (as highlighted above in the code) which will remove the value of that checked box from the textarea. I have tried to use the trigger("change") option but could not find a luck. Please help me!

Please note, in the code below I've just tried the trigger event with checkbox D alone to see if it works.

$(function(){
    $(".firm[value='C']").change(function(){
        $(".firm[value='D']").prop('checked', false).trigger("change");
        $(".firm[value='D'], .firm[value='E'], .firm[value='F'], .firm[value='G']").attr("disabled", $(this).is(":checked"));  
    });
});

回答1:

This seems to work for me:

$(".firm[value='C']").change(function(){
        $(".firm[value='D'], .firm[value='E'], .firm[value='F'], .firm[value='G']").prop('checked', false).trigger("change");
        $(".firm[value='D'], .firm[value='E'], .firm[value='F'], .firm[value='G']").attr("disabled", $(this).is(":checked"));  
    });

You can see it in action here: https://jsfiddle.net/aaronfranco/cvhphzgq/2/

来源：https://stackoverflow.com/questions/36647007/trigger-change-event-of-a-checkbox