小编dat*_*ane的帖子

在我的Shopify商店中,我有一个for循环,它将显示页面上的每个产品.对于每个产品,在底部,我有一个select将确定每个产品的结算频率.目前有3种产品,如果重要的话:

<select id="ma" class="single-option-selector" name="frequency">
    <option value="">Monthly</option>
    <option value="annual">Annual - 1 Month Free</option>
</select>

然后我根据所选选项(每月或每年)显示"继续"按钮

<a href="{{ product.url | within: collection }}" class="monthly-btn btn">
    <span id="AddToCartText">Select Plan</span>
</a>

<a href="{{ product.url | within: collection | append: '-annual' }}" class="annual-btn btn">
    <span id="AddToCartText">Select Plan</span>
</a>

我正在寻找合适的脚本,它将隐藏并显示基于当前所选选项的按钮.这是我现在没有做任何事情(我通过在那里添加警报确认 - 更改值时我没有得到任何警报弹出窗口)

<script>
  $(document).ready( function () {
    $('.annual-btn').each( function() {
      $(this).hide();
    });
  });

$('#ma').each( function() { 
  $(this).change( function () {
    var valx = $(this).val()
    if (valx == 'annual') {
      $('.monthly-btn').hide();
      $('.annual-btn').show();
      alert('test');
    } …