使用 WooCommerce，我希望在客户单击产品价格中的“库存”时隐藏/禁用产品属性“颜色部分”并了解如何

Posted 2023-05-08

【中文标题】使用 WooCommerce，我希望在客户单击产品价格中的“库存”时隐藏/禁用产品属性“颜色部分”并了解如何

【英文标题】：using a WooCommerce,i wanted the product attribute "color section" to be hidden/disable when a customer clicked "stock" in product price and idk how

【发布时间】：2021-12-14 14:56:24

【问题描述】：

function hideStock()
        var selected = document.getElementById("stk");
        var hidden = document.getElementById("pa_color");
        if (selected.onchange=="stock") 
                hidden.style.display = "none";
        

<table class="variations" cellspacing="0">
  <tbody>
        <tr>
        <td class="label"><label for="pa_pricing">Pricing</label></td>
        <td class="value">
    <select id="pa_pricing" class="" name="attribute_pa_pricing" data-attribute_name="attribute_pa_pricing" data-show_option_none="yes" onchange= "getSelectValue(this.value);">
      <option value="">Choose an option</option>
      <option value="retail" >Retail</option>
      <option value="stock" id = "stk" >Stock</option>
    </select>                       
          </td>
            </tr>
            <tr>
            <td class="label"><label for="pa_color">Color</label></td>
                        <td class="value">
        <select id="pa_color" class=" " name="attribute_pa_color" data-attribute_name="attribute_pa_color" data-show_option_none="yes">
            <option value=""  >Choose an option</option>
            <option value="aqua"  >Aqua</option>
            <option value="black"  >Black</option>
            <option value="mixed"  >Mixed</option>

        </select>
                <a class="reset_variations" href="#">Clear</a>
            </td>
            </tr>
    </tbody>
</table>

此 html 代码是我现在正在做的 woocommerce 商店的一小部分，它具有产品属性，一个用于价格（零售、库存），另一个用于颜色

【参考方案1】：

试试看：

var selected = document.getElementById("stk");
var hidden = document.getElementById("pa_color");
selected.addEventListener('change', _ => 
    if (selected.value == "stock") 
        hidden.style.display = "none";