如何在自定义产品详细信息页面上显示可变产品下拉菜单

Question

我正在开发woo电子商务网站，我有一个自定义模板来显示产品详细信息，即single-product.php。在此模板中，我有一个价格下拉列表，我想动态显示该下拉列表，当客户更改产品数量时，它将根据数量更改价格。是否有任何过滤器可实现此功能。我的代码如下

<div class="prodl-area-rt">
              <h1><?php the_title();?></h1>
              <ul>
                  <li><b>SKU:</b> <span><?php echo $product->get_sku();?></span></li>
                  <li><b>Category:</b> <span><?php echo $product->get_categories();?></span></li>
                  <!--<li><b>Price:</b> <span><s><?php echo get_woocommerce_currency_symbol("USD");?><?php echo $product->get_regular_price();?></s> </span><b class="pr-price"><?php echo get_woocommerce_currency_symbol("USD");?><?php echo $product->get_sale_price();?></b></li>-->
                  <li><b>Pack Sizes:</b> <span>
                                       <select>
                                          <option>1 L</option>
                                          <option>2 L</option>
                                          <option>3 L</option>
                                          <option>5 L</option>
                                          <option>10 L</option>
                                        </select>
              </span></li>
                  <li><b>Price:</b> <?php
                    echo '<div class="priceGroup">'. $product->get_price_html() .' </div>';
                  ?></li>


                  <!--<li><b>Quantity:</b> <span><?php echo $product->get_stock_quantity();?></span></li>-->
                  <li><b>Availability:</b> <span class="instock"><?php echo $product->get_stock_status();?></span></li>
              </ul>
              <?php
              echo "<pre>"; print_r($product); echo "</pre>";

              ?>

我可以根据产品数量显示价格变化，但是真正的问题是，当我单击“购买”按钮时，它没有可变价格。是否有任何过滤器/挂钩可以解决？