Javascript 自动选中该框或使用敲除将其禁用

所以我试着做两件事中的一件：

1） 当所有三个框都选中（付款、提货和退货）时，我希望自动选中第四个框（已完成）

或

2） 我希望禁用第四个框（已完成），直到选中所有其他框

我不能用敲除js找出任何一个。这是我的密码：

<div class="center">
    <h2> Grad Apparels </h2>
    <table>
        <thead>
            <tr> 
                <th></th>
                <th> ID Number </th>
                <th> Full Name </th>
                <th> Payments </th>
                <th> Picked Up </th>
                <th> Returned </th>
                <th> Completed </th>
                <th></th>
            </tr>
        </thead>
        <tbody data-bind="foreach: apparels">
            <tr>
                <td data-bind="text: ($index() + 1)"> </td>
                <th data-bind="text: id"></th>
                <th data-bind="text: name"></th>
                <th> <input type="checkbox"> </th>  
                <th> <input type="checkbox"> </th> 
                <th> <input type="checkbox"> </th>
                <th> <input type="checkbox"> </th>
                <td> <a href="#" data-bind="click: $parent.remove">Remove</a></td>
            </tr>
        </tbody>
    </table>
    <br>
    <p> ID: <input data-bind="value: id"> </p>

    <p> Full Name: <input data-bind="value: name"></p>
    <button data-bind="click: add">ADD</button>
</div>

---

您可以向

服装

对象添加三个可观察对象（

付款

，

挑选

和

返回

）和一个计算对象（

全部选中

）：

    function apparel(id, name){
        var self = this;

        self.id = ko.observable(id);
        self.name = ko.observable(name);

        self.payments = ko.observable();
        self.pickedUp = ko.observable();
        self.returned = ko.observable();

        self.allChecked = ko.computed(function() {      
            return self.ch1() && self.ch2() && self.ch3();
        });
    };      

然后在您的表格中使用它们：

    <div class="center">
        <h2> Grad Apparels </h2>
        <table>
            <thead>
                <tr> 
                    <th></th>
                    <th> ID Number </th>
                    <th> Full Name </th>
                    <th> Payments </th>
                    <th> Picked Up </th>
                    <th> Returned </th>
                    <th> Completed </th>
                    <th></th>
                </tr>
            </thead>
            <tbody data-bind="foreach: apparels">
                <tr>
                    <td data-bind="text: ($index() + 1)"> </td>
                    <th data-bind="text: id"></th>
                    <th data-bind="text: name"></th>

                    <th> <input type="checkbox" data-bind="checked: payments"></th>  
                    <th> <input type="checkbox" data-bind="checked: pickedUp"></th>  
                    <th> <input type="checkbox" data-bind="checked: returned"></th>  
                    <th> <input type="checkbox" disabled data-bind="checked: allChecked "> </th>
                    <td> <a href="#" data-bind="click: $parent.remove">Remove</a></td>
                </tr>
            </tbody>
        </table>
        <br>
        <p> ID: <input data-bind="value: id"> </p>

        <p> Full Name: <input data-bind="value: name"></p>
        <button data-bind="click: add">ADD</button>
    </div>      

毕业生服装
身份证号码
全名
付款
拾起
返回
完整的


身份证：

全名：

添加

    <div class="center">
        <h2> Grad Apparels </h2>
        <table>
            <thead>
                <tr> 
                    <th></th>
                    <th> ID Number </th>
                    <th> Full Name </th>
                    <th> Payments </th>
                    <th> Picked Up </th>
                    <th> Returned </th>
                    <th> Completed </th>
                    <th></th>
                </tr>
            </thead>
            <tbody data-bind="foreach: apparels">
                <tr>
                    <td data-bind="text: ($index() + 1)"> </td>
                    <th data-bind="text: id"></th>
                    <th data-bind="text: name"></th>

                    <th> <input type="checkbox" data-bind="checked: payments"></th>  
                    <th> <input type="checkbox" data-bind="checked: pickedUp"></th>  
                    <th> <input type="checkbox" data-bind="checked: returned"></th>  
                    <th> <input type="checkbox" disabled data-bind="checked: allChecked "> </th>
                    <td> <a href="#" data-bind="click: $parent.remove">Remove</a></td>
                </tr>
            </tbody>
        </table>
        <br>
        <p> ID: <input data-bind="value: id"> </p>

        <p> Full Name: <input data-bind="value: name"></p>
        <button data-bind="click: add">ADD</button>
    </div>