2011-07-03 22 views
0

チェックボックスを無効にする方法はありますか?以下は私のコードです:私は私がID #platinumチェックボックスをクリックしたときのid #scheduleチェックボックスから無効に削除したいjQueryの検証プラグインをクリックして他のチェックボックスを無効にするチェックボックスを無効にする

<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内で複数のDOM要素を持つことが許されていません
+0

同じ「id」を持つ複数の要素を持つことは、HTMLでは合法ではありません。これらの要素を 'class'または' name'で見たいと思うでしょう –

答えて

0

ドキュメント。あなたのページでidが一意であることを確認する必要があります。

を念頭に置いて

、あなたがname[]で要素を選択し、それらをそのように無効にできます。

jQueryの< 1.6、1.61

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

のjQuery> = 1.6

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