jquery - チェックボックスをオンにした後にフィールドセットが必要

Question

先週、HTML/CSS、javascript、jQuery の学習を始めたばかりで、助けていただければ幸いです。チェックボックス (id #ship_to_billing) と 5 つのテキスト フィールドを含むフィールドセット (id #shipping_info) を持つフォームを作成しました。JQueryを使用して、チェックボックスがチェックされている場合、他のフィールドを切り替えて非表示にするように設定しました。しかし、どちらか一方を追加で要求する方法がわかりません。チェックボックスをオンにするか、フィールドセット内のすべてのテキスト フィールドを入力する必要があります。アラートは必要ありません。助けてください！

よろしくお願いします、スーザン

<a type="button" class="btn btn-primary" href="#product-options" data-           
toggle="modal">Buy This!</a>                                        
    <div class="modal hide fade" id="product-options">                    
        <div class="modal-header center">
             <a class="close" data-dismiss="modal">x</a>
                <h3>When, Where and How?</h3>
         </div>
            <div class="modal-body l-m"> 
            {% include 'datepicker' %}
            <p>
            <input type="hidden" name="properties[ship_to_billing]" value="" />                          
            <label for="ship_to_billing" style="max-width:335px;">
            <input id="ship_to_billing" type="checkbox" name="properties[Ship to Billing Address]" value="Yes" {% if properties.ship_to_billing %} checked="checked"{% endif %} />
            <font size=1>Check here to have items shipped to your billing address (collected during checkout). Otherwise please fill out the information below.</font>
            </label><br /> 
            </p>                        
          <div class="fieldgroup" id="shipping_info">
            <label for="shipping_name">Name of Recipient:</label>      
            <input class="input-xlarge" type="text" id="shipping_name" placeholder="Name" name="properties[Recipient]" required="required" />                                 
            <p>
            <label for="address_street">Shipping Address:</label>
            <input class="input-xlarge" type="text" id="address_street" placeholder="Street Address" name="properties[Address]" required="required" />
            <input class="input-xlarge" type="text" id="address_city" placeholder="City" name="properties[City]" required="required" />
            <input class="input-medium" type="text" id="address_province" placeholder="State" name="properties[State]" required="required" />
            <input class="input-medium" type="text" id="address_zip" placeholder="Zip Code" name="properties[Zip]" required="required" />
            </p>
          </div>
          <p>
          <label for="gift_msg">Gift Message :</label>                                
          <textarea id="gift_msg" placeholder="Please type your message" name="properties[Gift Message]" rows="4" cols="45"></textarea> 
          </p>                              
       </div>

       <div class="modal-footer">
           <div class="btn-group">
                <button href="#" class="btn" data-dismiss="modal">Cancel</button>
                <button type="submit" onclick="return validateShipping();" class="btn btn-primary" id="addtocart">Add To Cart</button>
            </div>
          </div>              
        </div>

Jクエリ:

<script>
$('#ship_to_billing').change(function(){
$('#shipping_info').toggle('show');
});
</script>