jQuery验证插件单击复选框以删除禁用另一个复选框

时间:2011-07-03 16:07:23

标签: jquery jquery-validate

有没有办法从另一个复选框禁用中删除复选框禁用?以下是我的代码:

  <head>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/cupertino/jquery-ui.css" />
<link rel="stylesheet" type="text/css" media="screen" href="http://jquery-ui.googlecode.com/svn/branches/dev/themes/base/ui.button.css" />
<script src="jquery-validation-1.8.1/lib/jquery.js" type="text/javascript"></script>
<script src="jquery-validation-1.8.1/lib/jquery.metadata.js" type="text/javascript"></script>
<script src="jquery-validation-1.8.1/jquery.validate.js" type="text/javascript"></script>
<link rel="stylesheet" href="style.css" media="screen" />
                <script>
                $(document).ready(function() {
                $("#platinum").click(function () {
                  $("#schedule").removeAttr("disabled")
                });
                });


                </script>
</head> 

        <div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
        <h3>Booking Confirmation</h3>
        <div style="border: medium none;display: inline;padding: 0;text-align:left">
        <h4>I wish to participate in the JUMP START Vitality Challenge Program:</h4>
        <p><input id="platinum" class="checkbox" type="checkbox" value="Platinum" name="program[]" validate="required:true,minlength:1,maxlength:1" />Platinum Level - $677 - 5 sessions per week</p>
        <p><input id="gold" type="checkbox" value="Gold" name="program[]" />Gold Level - $497 - 2 sessions per week</p>
        <p><input id="silver" type="checkbox" value="Silver" name="program[]" />Silver Level - $297</p>
        </div>
        <div style="border: medium none;display: inline;padding: 0;text-align:left">
        <h4>I wish to participate in the JUMP START Vitality Challenge Program, and I am a current Jump Start client:</h4>
        <p><input type="checkbox" value="Platinum - Current Client" name="program[]" />Platinum Level - $598 - 5 sessions per week</p>
        <p><input type="checkbox" value="Gold - Current Client" name="program[]" />Gold Level - $418 - 2 sessions per week</p>
        <p><input type="checkbox" value="Silver - Current Client" name="program[]" />Silver Level - $218</p>
        </div>
        <p><label class="error" for="program[]" >Please select one.</label></p>

        <div>
        <table>
        <tr><td><h3>Payment Options</h3></td></tr>
            <tr>
                <td>
                <h4><input type="checkbox" value="Paypal" name="payment[]" validate="required:true,minlength:1,maxlength:1" />1. Credit Card or Paypal </h4>
                <iframe src="paypal.php" width="100%" height="100%" style="border:none">
                </iframe>
                </td>
            </tr>
            <tr>
                <td>
                    <br/>
                    <h4>2. Bank Transfer</h4>
                        <p><input type="checkbox" value="Bank Transfer" name="payment[]" />I am securing my place by sending in my completed forms and transferring the full amount to the Jump Start bank account. Please send an email with the receipt number once this is done.</p>
                    <ul>
                        <li>Bank: Westpac</li>
                        <li>Account Name: Jump Start Personal Training Pty Ltd</li>
                        <li>Account Number: 351 539</li>
                        <li>BSB: 032197</li>
                    </ul>
                    <br/>
                    <h4><input type="checkbox" value="Call the office" name="payment[]" />3. Call the office on (02) 9904 1201 with your credit card details for payment.</h4>
                    <p><label class="error" for="payment[]" >Please select one.</label></p>
                </td>
            </tr>
    </table>
</div>      
    <table cellpadding="7" cellspacing="0" width="657" style="padding:5px;border:solid 1px;" id="schedule">
        <thead>
        <tr>
            <td><h3>Monday</h3></td>
            <td><h3>Tuesday</h3></td>
            <td><h3>Wednesday</h3></td>
            <td><h3>Thursday</h3></td>
            <td><h3>Friday</h3></td>
            <td><h3>Saturday</h3></td>
        </tr>
        </thead>
        <tbody>
            <tr>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 6.30-7.30am" disabled="disabled" /><p>Fitness Circuit<br/> <span>6.30-7.30am</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fit 2 Box 6.30-7.30am" disabled="disabled"  /><p>Fit 2 Box<br/> <span>6.30-7.30am</span></p></td>
                <td><p align="CENTER">&nbsp;</p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fit 2 Box 6.30-7.30am" disabled="disabled"  /><p>Fit 2 Box<br/> <span>6.30-7.30am</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 6.30-7.30am" disabled="disabled"  /><p>Fitness Circuit<br/> <span>6.30-7.30am</span></p></td>
                <td><p align="CENTER">&nbsp;</p></td>
            </tr>
            <tr>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Run 4 Fun 6.30-7.30am" disabled="disabled"  /><p>Run 4 Fun<br/> <span>6.30-7.30am</span></p></td>
                <td><p>&nbsp;</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 7.30-8.30am" disabled="disabled"  /><p>Fitness Circuit<br/><span>7.30-8.30am</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Core Strength 7.15-8.15am" disabled="disabled"  /><p>Core Strength<br/> <span>7.15-8.15am</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Walk 2 Trot 8.30-9.15am" disabled="disabled" /><p>Walk 2 Trot<br/><span>8.30-9.15am</span></p></td>
            </tr>
            <tr>
                <td><p><span>&nbsp;</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 9.30-10.30am*" /><p>Fitness Circuit<br/> <span>9.30-10.30am*</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 9.30-10.30am*" /><p>Fitness Circuit<br/> <span>9.30-10.30am*</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 9.30-10.30am*" /><p>Fitness Circuit<br/> <span>9.30-10.30am*</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 9.30-10.30am" /><p>Fitness Circuit<br/> <span>9.30-10.30am</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Core Strength 9.30-10.30am" /><p>Core Strength<br/><span>9.30-10.30am</span></p></td>
            </tr>
            <tr>
                <td><p><span>&nbsp;</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 10.30-11.30am*" /><p>Fitness Circuit<br/><span>10.30-11.30am*</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 10.30-11.30am" /><p>Fitness Circuit<br/><span>10.30-11.30am</span></p></td>
            </tr>
            <tr>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 6.30-7.30pm" /><p>Fitness Circuit<br/><span>6.30-7.30pm</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 6.30-7.30pm" /><p>Fitness Circuit<br/><span>6.30-7.30pm</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fit 2 Box 6.30-7.30pm" /><p>Fit 2 Box<br/><span>6.30-7.30pm</span></p></td>
                <td><input name="schedule[]" id="schedule" type="checkbox" value="Fitness Circuit 6.30-7.30pm" /><p>Fitness Circuit<br/><span>6.30-7.30pm</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <td><p><span>&nbsp;</span></p></td>
                <p><label class="error" for="schedule[]" >Please select your sessions.</label></p>


            </tr>
        </tbody>
    </table>

当我点击id #platinum复选框时,我想从id #schedule复选框中删除禁用...

1 个答案:

答案 0 :(得分:0)

不允许在文档中使用多个具有相同id的DOM元素。您应该确保id在您的网页上是唯一的。

考虑到这一点,您可以按name[]选择元素并以这种方式禁用它们:

jQuery&lt; 1.6,1.61

$(document).ready(function() {
    $("#platinum").click(function() {
        $("input[name='schedule[]']").removeAttr("disabled");
    });
});

jQuery&gt; = 1.6

$(document).ready(function() {
    $("#platinum").click(function() {
        $("input[name='schedule[]']").prop("disabled", false);
    });
});