Javascript 在Shopify购物车中选中的“至少在表单上需要”复选框

我在一个网站上工作，我需要添加一个“你是怎么听说我们的”选项，并在购物车结帐时列出销售代表的名单。我需要能够要求至少在选项被选中。我不擅长编写代码，所以我尝试过研究和构建这个，但它不起作用。如果有人能告诉我我做错了什么，我想我很接近了

HTML和脚本

    </br>
<p><strong>How did you hear about us? If it was from multiple reps, please choose all of them.</strong> <em>(*required)</em>
          <div class="reps">
            <ul>
                <li>            
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Internet]" value="yes" {% if cart.attributes.rep1 %} checked="checked"{% endif %} />
                    <label for="rep1">Internet</label>
                </li>
                <li>
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Facebook]" value="yes" {% if cart.attributes.rep2 %} checked="checked"{% endif %} />
                    <label for="rep2">Facebook</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Instagram]" value="yes" {% if cart.attributes.rep3 %} checked="checked"{% endif %} />
                    <label for="rep3">Instagram</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Pinterest]" value="yes" {% if cart.attributes.rep4 %} checked="checked"{% endif %} />
                    <label for="rep4">Pinterest</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Mary Seldon Andrews]" value="yes" {% if cart.attributes.Mary-Seldon-Andrews %} checked="checked"{% endif %} />
                    <label for="rep5">Mary Seldon Andrews</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Elinor Anthony]" value="yes" {% if cart.attributes.rep6 %} checked="checked"{% endif %} />
                    <label for="rep6">Elinor Anthony</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Sara Brown]" value="yes" {% if cart.attributes.rep7 %} checked="checked"{% endif %} />
                    <label for="rep7">Sara Brown</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Reilly Burnetti]" value="yes" {% if cart.attributes.rep8 %} checked="checked"{% endif %} />
                    <label for="rep8">Reilly Burnetti</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Ellie Carter]" value="yes" {% if cart.attributes.rep9 %} checked="checked"{% endif %} />
                    <label for="rep9">Ellie Carter</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Jilli DeLaney]" value="yes" {% if cart.attributes.rep10 %} checked="checked"{% endif %} />
                    <label for="rep10">Jilli DeLaney</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Haley Dellaccio]" value="yes" {% if cart.attributes.rep11 %} checked="checked"{% endif %} />
                    <label for="rep11">Haley Dellaccio</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Mary Keller Greene]" value="yes" {% if cart.attributes.rep12 %} checked="checked"{% endif %} />
                    <label for="rep12">Mary Keller Greene</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Alex Greene]" value="yes" {% if cart.attributes.rep13 %} checked="checked"{% endif %} />
                    <label for="rep13">Alex Greene</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Anna Gwin]" value="yes" {% if cart.attributes.rep14 %} checked="checked"{% endif %} />
                    <label for="rep14">Anna Gwin</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Claire Hand]" value="yes" {% if cart.attributes.rep15 %} checked="checked"{% endif %} />
                    <label for="rep15">Claire Hand</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Eliza Harmon]" value="yes" {% if cart.attributes.rep16 %} checked="checked"{% endif %} />
                    <label for="rep16">Eliza Harmon</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Leeann Huynh]" value="yes" {% if cart.attributes.rep17 %} checked="checked"{% endif %} />
                    <label for="rep17">Leeann Huynh</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Lillia Jordan" value="yes" {% if cart.attributes.rep18 %} checked="checked"{% endif %} />
                    <label for="rep18">Lillia Jordan</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Cassidy Kotyla]" value="yes" {% if cart.attributes.rep19 %} checked="checked"{% endif %} />
                    <label for="rep19">Cassidy Kotyla</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Elizabeth Moore]" value="yes" {% if cart.attributes.rep20 %} checked="checked"{% endif %} />
                    <label for="rep20">Elizabeth Moore</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Jordan Moore]" value="yes" {% if cart.attributes.rep21 %} checked="checked"{% endif %} />
                    <label for="rep21">Jordan Moore</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Morgan Nail]" value="yes" {% if cart.attributes.rep22 %} checked="checked"{% endif %} />
                    <label for="rep22">Morgan Nail</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Heather Nave]" value="yes" {% if cart.attributes.rep23 %} checked="checked"{% endif %} />
                    <label for="rep23">Heather Nave</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Elizabeth Pearce]" value="yes" {% if cart.attributes.rep24 %} checked="checked"{% endif %} />
                    <label for="rep24">Elizabeth Pearce</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Amanda Przybysz]" value="yes" {% if cart.attributes.rep25 %} checked="checked"{% endif %} />
                    <label for="rep25">Amanda Przybysz</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Emme Slaton]" value="yes" {% if cart.attributes.rep26 %} checked="checked"{% endif %} />
                    <label for="rep26">Emme Slaton</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Kaeleigh Starling]" value="yes" {% if cart.attributes.rep27 %} checked="checked"{% endif %} />
                    <label for="rep27">Kaeleigh Starling</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Morgan Stockard]" value="yes" {% if cart.attributes.rep28 %} checked="checked"{% endif %} />
                    <label for="rep28">Morgan Stockard</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Lorin Taylor]" value="yes" {% if cart.attributes.rep29 %} checked="checked"{% endif %} />
                    <label for="rep29">Lorin Taylor</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Klaudia Virkler]" value="yes" {% if cart.attributes.rep30 %} checked="checked"{% endif %} />
                    <label for="rep30">Klaudia Virkler</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Baird Whichard]" value="yes" {% if cart.attributes.rep33 %} checked="checked"{% endif %} />
                    <label for="rep31">Baird Whichard</label>
                </li>
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Savannah Zechiel]" value="yes" {% if cart.attributes.rep32 %} checked="checked"{% endif %} />
                    <label for="rep32">Savannah Zechiel</label>
                </li>       
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Anna Pizzitola]" value="yes" {% if cart.attributes.rep33 %} checked="checked"{% endif %} />
                    <label for="rep33">Anna Pizzitola</label>
                </li>       
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Alyssa Hope]" value="yes" {% if cart.attributes.rep34 %} checked="checked"{% endif %} />
                    <label for="rep34">Alyssa Hope</label>
                </li>       
                <li>                
                    <input type="hidden" name="attributes[rep]" value="" />
                    <input id="reps" type="checkbox" name="attributes[Other]" value="yes" {% if cart.attributes.rep35 %} checked="checked"{% endif %} />
                    <label for="rep35">Other</label>
                </li>       
        </p>
        </div>

        <script>
            jQuery(function($) { 
                $(document).ready(function() {
                    $('#reps').submit(function() {  
                        var $fields = $(this).find('input[name="attributes[rep]"]:checked');
                        if (!$fields.length) {
                            alert('You must check at least one box!');
                            return false; // The form will *not* submit
                        }
                    });
                });
            });
        </script>

你是怎么听说我们的？如果来自多个代表，请选择所有代表。（*必选）


互联网


脸谱网


一款图片分享应用


品特烈


玛丽·塞尔登·安德鲁斯


埃莉诺·安东尼


莎拉布朗


赖利·伯内蒂


艾莉·卡特


吉利·德莱尼


哈雷·德拉乔


玛丽·凯勒·格林


亚历克斯·格林


安娜·格温


克莱尔·汉德


伊丽莎·哈蒙


利安·惠恩


莉莉亚·乔丹


卡西迪·科提拉


伊丽莎白·穆尔


乔丹·摩尔


摩根钉子


石南中堂


伊丽莎白·皮尔斯


阿曼达·普兹比兹


埃米·斯莱顿


卡利椋鸟


摩根·斯托克德


洛林·泰勒


克劳迪亚·维克勒


贝尔德·惠查德


萨凡纳·泽切尔


安娜·皮兹托拉


艾莉莎·霍普


另外


jQuery（函数（$）{
$（文档）.ready（函数（）{
$（'#reps'）.submit（函数（）{
var$fields=$（this.find（'input[name=“attributes[rep]”）：选中'）；
如果（！$fields.length）{
警报（'您必须至少选中一个框！'）；
return false；//表单将*不*提交
}
});
});
});

这是shopify购物车页面代码

<!-- Bold: Options --> 
<script>function update_qty_builder(builder_id, qty){ jQuery('.'+builder_id+"_qty").val(qty.value); } function remove_product_builder(builder_id){ jQuery('.'+builder_id+"_qty").val(0); jQuery('.'+builder_id+"_qty").parents("form").submit(); }</script>
{% include 'bold-cart-handler' %}
<div id="cart">

  <!-- Begin empty cart -->
  {% if cart.item_count == 0 %}
  <div class="row">
    <div class="span11 expanded-message">
      <br>
      <br>
      <h2 class="tc">{{ 'cart.general.empty' | t }}</h2>
    </div>
  </div>
  <!-- End empty cart -->

  <!-- Begin cart -->
  {% else %}
  <div class="row">
    <div class="span11">
      <h1>{{ 'cart.general.title' | t }}</h1>
      <form action="/cart" method="post" id="cartform">
        <table>
          <thead>
            <tr>
              <th class="image">{{ 'cart.label.product' | t }}</th>
              <th class="item">&nbsp;</th>
              <th class="qty">{{ 'cart.label.quantity' | t }}</th>
              <th class="price">{{ 'cart.label.price' | t }}</th>
              <th class="remove">&nbsp;</th>
            </tr>
          </thead>
          <tbody>
            {% for item in cart.items %}
            {% if item.properties.master_builder == blank %} <!-- Bold: Options (Part 5) -->
            {% if item.properties.builder_id == blank %}
            <tr class="bold-row">
            {% else %}
            <tr style="display:none" class="bold-row-{{ item.properties.builder_id }} item {{ item.product.handle }}">
            {% endif %}
              <td class="image">
                <div class="product_image">
                  <a href="{{ item.url }}">
                    <img src="{{ item | img_url: 'small' }}"  alt="{{ item.title | escape }}" />
                  </a>
                </div>
              </td>
              <td class="item">
                <a href="{{ item.url }}">
                  <strong>{{ item.product.title }}</strong>
                  {% if item.product.variants.size > 1 %}
                  <span class="variant_title">{{ item.variant.title }}</span>
                  {% endif %}
                </a><br />
                {% for p in item.properties %}
                  {% if p.first == "builder_id" or p.first == "builder_info" or p.first == "master_builder" or p.last == "" %}
                  {% else %}
                  {% unless p.last == blank %}
                  {{ p.first }}:
                    {% if p.last contains '/uploads/' %}
                    <a class="lightbox" href="{{ p.last }}">{{ p.last | split: '/' | last }}</a><br/>
                    {% else %}
                    {{ p.last }}<br/>
                  {% endif %}
                  <br />
                  {% endunless %}
                  {% endif %}
                {% endfor %}
              </td>
              <td class="qty">
                {% if item.properties.builder_id == blank %}
                <input type="text" size="4" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" onfocus="this.select();" class="tc item-quantity" {% if item.product.metafields.inventory.ShappifyHidden == "true" %} readonly="readonly" {% endif %} />
                {% else %}
                <input data-product-id="{{ item.product.id }}" type="text" size="4" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" onfocus="this.select();" class="tc item-quantity {{ item.properties.builder_id }}_qty" {% if item.product.metafields.inventory.ShappifyHidden == "true" %} readonly="readonly" {% endif %} />
                {% endif %}
              </td>
              <td class="price">{{ item.line_price | money }}</td>
              <td class="remove">
                {% if item.properties.builder_id == blank %}
                <a href="/cart/change?line={{ forloop.index }}&quantity=0" class="cart">{{ 'cart.general.remove' | t }}</a>
                {% else %}
                <a href="/cart/change?line={{ forloop.index }}&quantity=0" class="cart {{ item.properties.builder_id }}_remove">{{ 'cart.general.remove' | t }}</a>
                {% endif %}
              </td>
            </tr>
            {% else %} <!-- Bold: Options (Part 6) -->
            {% if item.properties.builder_info %}
            {% assign builder = item.properties.builder_info | split: '~~' %}
            {% endif %}
            {% assign item_price = 0 %}
            {% assign item_line_price = 0 %}
            {% for price_item in cart.items %}
            {% unless price_item.properties.builder_id == blank %}
            {% if price_item.properties.builder_id == item.properties.builder_id %}
            {% capture temp %}{{ item_price | plus: price_item.price }}{% endcapture %}
            {% assign item_price = temp %}
            {% capture temp %}{{ item_line_price | plus: price_item.line_price }}{% endcapture %}
            {% assign item_line_price = temp %}
            {% endif %}
            {% endunless %}
            {% endfor %}
            <tr class="item bold-row-{{ item.properties.builder_id }} {{ builder[2] }}">
              <td class="image">
                <div class="product_image">
                  <a href="{{ item.url }}">
                    {% if builder[0] %}
                    <img src="{{ builder[1] }}" alt="{{ builder[0] }}" />
                    {% else %}
                    <img src="{{ item | img_url: 'small' }}"  alt="{{ item.title | escape }}" />
                    {% endif %}
                  </a>
                </div>
              </td>
              <td class="item">
                <a href="{{ item.url }}">
                  <strong>{{ item.product.title }}</strong>
                  {% if item.product.variants.size > 1 %}
                  <span class="variant_title">{{ item.variant.title }}</span>
                  {% endif %}
                </a>
                <div class="bold-properties-{{ item.properties.builder_id}}">
                {% for p in item.properties %}
                {% if p.first == "builder_id" or p.first == "builder_info" or p.first == "master_builder" or p.last == "" %}
                {% if p.first == "builder_info" %}{% assign is_builder=true %}{% endif %}
                {% else %}
                <b>{{ p.first }}</b>:
                {% if p.last contains '/uploads/' %}
                <a href="{{ p.last }}">{{ p.last | split: '/' | last }}</a><br/>
                {% else %}
                {{ p.last }}<br/>
                {% endif %}
                {% endif %}
                {% endfor %}
                </div>
                <div id="bold-item-{{ item.properties.builder_id }}" data-is-builder="{{ is_builder }}" data-handle="{{ item.product.handle }}" data-variant-id="{{ item.variant.id }}" class="bold-edit-item"></div>

              </td>
              <td class="qty">
                <input type="text" size="4" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" onfocus="this.select();" onchange="update_qty_builder('{{item.properties.builder_id}}', this);" class="tc item-quantity {{ item.properties.builder_id }}_qty" {% if item.product.metafields.inventory.ShappifyHidden == "true" %} readonly="readonly" {% endif %} />
              </td>
              <td class="price">{{ item_line_price | money }}</td>
              <td class="remove"><a href="#" class="cart {{ item.properties.builder_id }}_remove" onclick="remove_product_builder('{{item.properties.builder_id}}');">{{ 'cart.general.remove' | t }}</a></td>
            </tr>

            {% endif %} <!-- Bold: Options (code ends) -->
            {% endfor %}
            <tr class="summary">
              <td class="image">&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td class="price"><span class="total"><strong>{{ cart.total_price | money }}</strong></span></td>
              <td>&nbsp;</td>
            </tr>
          </tbody>
        </table>

        <div class="span7 inner-left inner-right">
          <div class="checkout-buttons clearfix">
            <a href="#" class="btn-back-to-school"><img src="https://cdn.shopify.com/s/files/1/0718/5633/files/wanttoshiptoyourschool.jpg?2665" alt="Want to ship to your school? Click here" class="ship-to-school"></a><br />
            <label for="note"><strong>ENTER THE FOLLOWING INFORMATION BELOW if your school qualifies for dorm&nbsp;delivery. </strong><br />
            <br />
            - name<br />
            - university<br />
            - best contact phone number(s) on move-in day<br />
            - move-in date<br />
            <br />
            <strong>If you have this information, please provide. If you don’t, we will contact you before move-in day for details.</strong><br />
            <br />
            - residence hall<br />
            - dorm room number</label><br /><br />
            <textarea id="note" name="note" rows="10" cols="50">{{ cart.note }}</textarea>
          </div>
          {% include 'hear-about-us' %}
        </div>

        <div class="span4 cart-buttons inner-right inner-left">
          <div class="buttons clearfix">
            <input type="submit" id="checkout" class="btn" name="checkout" value="{{ 'cart.general.checkout' | t }}" />
            <input type="submit" id="update-cart" class="btn" name="update" value="{{ 'cart.general.update' | t }}" />
          </div>
        </div>

        {% if additional_checkout_buttons %}        
        <div class="row">
          <div class="extra-checkout-buttons span4">
          {{ content_for_additional_checkout_buttons }}
          </div>
        </div>
        {% endif %}

      </form>
    </div>
  </div>
  {% endif %}


<div class="fabric_popup cart"><div class="fabric_popup_curtain"></div><div class="fabric_popup_content"><p>Deliver to my Dorm Room Option: Dorm-Decor offers delivery to many colleges and universities.
We even offer our exclusive “Deliver to my Dorm Room” option. This Option will have your items waiting
for you in your dorm room on move-in day so you won’t have to lift a finger! Please check the University Page
to see if your school has this option. We are working everyday to add this option to more colleges and universities.
Please check back often to see if your school has been added.</p>
<p>If your school is not included in our special “Deliver-to-my-Dorm” option, you may also be able to ship your items
to your school’s mailroom. Please check with your school’s shipping policy and check the ship to address carefully.</p>
<p>Cubby Delivery Information and Charges: All Cubby shipments will incur a shipping charge of $75. Cubby deliveries must be signed for
by an adult 18 years or older. Please inspect your cubby before you sign at delivery. All damages must be reported immediately
  to shipper at time of delivery. Failure to notify shipper of damages at time of delivery could nullify your damage claim.</p></div></div>

  <script>       

  jQuery(document).ready(function($){

    $('.btn-back-to-school').click(function(event){
      $('.fabric_popup').fadeIn(300);
      event.preventDefault();
    });

    $('.fabric_popup_curtain').click(function(event){
      $('.fabric_popup').fadeOut(300);      
      event.preventDefault();
    });

  });
  </script>

  <!-- End cart -->

</div>

{% include 'bold-cart-modal' %}

函数更新构建器数量（构建器id，数量）{jQuery（'..'+builder\U id+“\U数量”