Drupal中的產品頁面：如果只有一個選項（“大小”）可用，則需要在選擇選項卡上調整css

Question

在Drupal Commerce的產品頁面上，某些項目具有尺寸選項，而另一些則沒有。 我需要為只有一個大小選項的那些選擇標簽調整css。 這是我的jQuery嘗試無濟於事：

if($(".page-store select.form-select option:selected").index()==0) {
  $(page-store select.form-select).addClass("one-option-only");
};

我該如何實現？

Answer 1

您的邏輯有些不對勁，並且您遇到語法錯誤。

//iterate each select
$('.page-store select.form-select').each(function() {
    //see if the current select has exactly one option
    if ($(this).find('option').length == 1) {
        //add the class
        $(this).addClass('one-option-only');
    }
});

Answer 2

檢查.children("option").length 。

$(document).ready(function() {
  $(".page-store select.form-select").each(function() {
    if ($(this).children("option").length === 1) {
      $(this).addClass("one-option-only");
    }
  });
});