0

これは本当に簡単だと思います。しかし、それは私にはうまくいきません。

ユーザーがタグを使用してリストから月を選択できるフォームを作成しました。

<select> <option>

onchange.goneその日のクラスSELECTが削除され、リストが表示されます。 onchanve年のクラスが削除され、.gone年が表示されます。INPUT

PHPを使用して、yearの値を現在の年に設定しました。月の値を取得し、31日目のタグ（2月の場合は29と30）にaddClass.goneを追加して、2月30日などがオプションにならないようにします。OPTIONうるう年をチェックするために年の値を4==0で％し、2月.gone29日にaddClassを追加しません。基本的な日付選択フォーム。

問題：クラスを追加.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>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 に答える