根据foreach中的选择值显示Div

Show Div depending on select Value in foreach

本文关键字：显示 Div 选择 foreach 根据      更新时间：2023-09-26

我们在列表中显示了产品。我们使用foreach

我们的清单上大约有25种产品。在这里，我们试图隐藏"添加到购物车"按钮，直到用选择选项进行选择。

对于每个单独的产品，这不起作用，因为我们对每个产品都有相同的类。

下面的脚本我们没有成功。加载需要很长时间，改变选择没有任何作用，添加到购物车按钮也不会隐藏。

下面是到目前为止的代码: 
    <script>
     $(document).ready( function() {
          $('.attribute_select').bind('change', function (e) { 
            if( $('.attribute_select').val() == 'choose') {
              $('#add_to_cart').hide();
            }
            else if( $('.attribute_select').val() != 'choose') {
              $('#add_to_cart').show();
            }         
          }).trigger('change');
        });
    </script>

    {foreach from=$products item=product name=products}
    <fieldset class="fs_1">
        <select name="s_name1" id="attribute_combination" class="attribute_select">
            <option value="choose" selected="selected">CHOOSE....</option>
            <option value="1" >1</option>
            <option value="2" >2</option>
        </select>
     </fieldset>
    <div id="add_to_cart}">
    <a class="" href="..." data-id-product-attribute="{$product.id_product_attribute|intval}" data-id-product="{$product.id_product|intval}" ></a>
    </div>
    {/foreach}

您有一个无效的DOM ID，您将无法匹配:

<div id="add_to_cart}">

应该是:

<div id="add_to_cart">

我们现在使用下面的代码，但是不能只显示/隐藏属于字段集

的添加到购物车按钮
$(function() {
     $('.add_to_cart').hide(); 
        $('.ndk_attribute_select').change(function(){
         if($('.ndk_attribute_select').val() != 'choose') {
             $('.add_to_cart').show(); 
         } else {
             $('.add_to_cart').hide(); 
         } 
     });
});

还有什么建议吗?

相关文章：