在“添加到购物车”按钮中要求输入为空

Question

在我的表单中，该按钮具有“添加到购物车”按钮，并带有输入以上传照片，该按钮可以正常工作，但是现在我需要的是，当客户单击该按钮时，验证照片是否已上传，如果没有，请先显示警报，然后再将其传递到购物车页面。

<div class="product-form__controls-group product-form__controls-group--submit">
              <div class="qtydiv">
                {% comment %}<label for="Quantity" class="quantity-selector">Quantity</label>{% endcomment %}
            <div class="qtybox">
              <span class="btnqty qtyminus icon icon-minus">-</span>
              <input type="text" id="quantity" name="quantity" value="1" min="1" class="quantity-selector quantity-input" readonly="">
              <span class="btnqty qtyplus icon icon-plus">+</span>
            </div>
          </div>
          <div class="product-form__item product-form__item--submit
            {%- if section.settings.enable_payment_button %} product-form__item--payment-button {%- endif -%}
            {%- if product.has_only_default_variant %} product-form__item--no-variants {%- endif -%}"
          >
            <button type="submit" name="add"
              {% unless current_variant.available %} aria-disabled="true"{% endunless %}
              aria-label="{% unless current_variant.available %}{{ 'products.product.sold_out' | t }}{% else %}{{ 'products.product.add_to_cart' | t }}{% endunless %}"
              class="btn product-form__cart-submit{% if section.settings.enable_payment_button %} btn--secondary-accent{% endif %}"
              data-add-to-cart>
              <span data-add-to-cart-text>
                {% unless current_variant.available %}
                  {{ 'products.product.sold_out' | t }}
                {% else %}
                  {{ 'products.product.add_to_cart' | t }}
                {% endunless %}
              </span>
              <span class="hide" data-loader>
                {% include 'icon-spinner' %}
              </span>
            </button>
            {% if section.settings.enable_payment_button %}
              {{ form | payment_button }}
            {% endif %}
          </div>
          <div class="product-form__item product-form__item--custom">
                <input required class="required product-form__input" id="photo" type="file" name="properties[Photo]">
          </div>
        </div>