0

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

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

<select> <option>

onchange.gone当天的课程SELECT被删除，从而显示列表。 从年份中删除onchanve的类，从而显示年份。.goneINPUT

我使用 PHP 将年份的值设置为当前年份。我想从月份和 addClass 中获取值.gone到第 31 天的OPTION标签（以及 2 月的 29 和 30），这样 2 月 30 日等就不是一个选项。我将通过 4==0 % 年份的值来检查闰年，然后不 addClass.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 天不可选择！

4

2 回答 2

4

问题：当我将类 .gone 添加到 OPTION 时。它仍然显示。我认为这只是我忘记了 html 的一些基本原则。尽管如此，我还是想不通。

不，<option>s 只是不支持通过 CSS 设置样式。要么disabled它，要么完全从 DOM 中删除它。

于 2013-01-22T19:44:43.280 回答
1

如果您将disabled属性添加到选项中，它将禁用它，使其无法选择

<option disabled>Value</option>

示例：http: //jsfiddle.net/BCk8m/

于 2013-01-22T19:44:57.737 回答