javascript - 用类隐藏<option>

我敢肯定这真的很简单。但这对我不起作用。

我写了一个表格，允许用户使用标签从列表中选择一个月：

<select> <option>

onchange从.gone开始删除的类别SELECT，从而显示列表。
onchanve年份.gone中的类INPUT被删除，从而显示年份。

我使用PHP将year的值设置为当前年份。我想从month中获取值并将addClass .gone添加到第31天（2月为29和30）的OPTION标记中，这样就不能选择2月30日等了。我将％的年份值乘以4 == 0来检查leap年，然后不将Class .gone添加到2月29日。基本日期选择表格。

问题：当我将类.gone添加到OPTION时，它仍然显示。我以为这只是我忘记了html的一些基本原理。但是，我无法弄清楚。

CSS：

.gone {display:none;}

我也可以这样：

.hidden {visibility:hidden;}

但这仍然显示了空间，因此我没有使用它。

HTML：

<html>
  <head>
     <link to css styles>

    <script language="JavaScript" type="text/javascript">
       function showDay() {

           $("#day").removeClass("gone")
       }

       function showYear() {

           $("#year").removeClass("gone")
       }
    </script>


  </head>
  <body>
      <table>
         <tr>
         <td>
           <select id="month" onchange="showDay();">
              <option>January</option>
              <option>more months...yada...yada</option>
              <option>December</option>
           </select>
         </td>
         <td>
           <select class="gone" id="day" onchange="showYear();">
              <option></option>
              <option>1</option>
              <option>2</option>
              <option>more days</option>
              <option class="gone">31</option>
           </select>
         </td>
         <td>
              <input class="gone" type="text"  size="5" name="year" id="year"
               value="<?php echo date("Y"); ?>"/>
         </td>
         </tr>
      </table>
  </body>
</html>

onchange javascript和php完全按照我的要求工作。我没有费心编写任何脚本来显示或消失这些日子，因为仅将.gone类放在OPTION标记中是行不通的。有没有办法使其隐藏或无法选择？一旦弄清楚了，我将编写脚本以使其根据月份和年份进行。

感谢您的所有帮助！

更新！！！

根据收到的答案。我将禁用我不希望使用javascript选择的日期。从w3schools.com，我获得了一个示例脚本，对该脚本进行了少许修改，并设置为从SELECT月开始调用onchange。

function disableElement()
{
  var sel=document.getElementById("day")
  sel.options[30].disabled=true;
  sel.options[31].disabled=true;
}

效果很好。现在无法选择第30天和第31天！

最佳答案

问题：当我将类.gone添加到OPTION中时。它仍然显示。我以为这只是我忘记了html的一些基本原理。但是，我无法弄清楚。

不，<option>只是不支持通过CSS进行样式设置。 disabled它或remove it from the DOM entirely。

关于javascript - 用类隐藏<option>，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14466722/

GONE

javascript - 用类隐藏<option>