1

他のオプションが選択されたときにテキストボックスを表示する、ある選択フィールドの作業コードがあります。ただし、同じページに 2 つの選択ボックスのコードを書くのに問題があります。

これが私のスクリプトです。

    function toggleField(val) {
      var o = document.getElementById('other');
      (val == 'Other') ? o.style.display = 'block': o.style.display = 'none';
    }
<SELECT NAME="i_skate" SIZE="1" ONCHANGE="toggleField(this.value);">
  <OPTION VALUE="Just a Fan">Just a Fan</OPTION>
  <OPTION VALUE="Everyday">Everyday</OPTION>
  <OPTION VALUE="Few times a Week">Few times a Week Week
  </OPTION>
  <OPTION VALUE="Few times a Month">Few times a Month Month
  </OPTION>
  <OPTION VALUE="Other">Other</OPTION>
</SELECT>
<INPUT TYPE="TEXT" NAME="other" ID="other" STYLE="display: none;" SIZE="20">
</TD>
<TD WIDTH="10" ALIGN="LEFT"></TD>
<TD WIDTH="110" ALIGN="LEFT" VALIGN="TOP">

  <SELECT NAME="my-style" SIZE="1" ONCHANGE="toggleField(this.value);">
    <OPTION VALUE="Street Skate">Street Skate</OPTION>
    <OPTION VALUE="Downhill">Downhill</OPTION>
    <OPTION VALUE="Freestyle">Freestyle</OPTION>
    <OPTION VALUE="Pools-Bowls">Pools-Bowls</OPTION>
    <OPTION VALUE="Vert Halfpipe">Vert Halfpipe</OPTION>
    <OPTION VALUE="Park">Park</OPTION>
    <OPTION VALUE="Mini Ramp">Mini Ramp</OPTION>
    <OPTION VALUE="Other1">Other1</OPTION>
  </SELECT>
  <INPUT TYPE="TEXT" NAME="other1" ID="other1" STYLE="display: none;" SIZE="20">

私は何が欠けていますか？

4

1 に答える 1

1

私があなたを正しく理解していれば、「Other1」が選択されたときに2番目のSELECTタグに2番目のINPUTボックスを表示させたいだけです。最初のものが「Other」の場合と同じです。

あなたは本当に近いですが、Javascript を調整する必要があります。現在、「その他」の変更された要素をテストしてから、「その他」の ID を持つ要素への参照であるオブジェクト o の表示を変更しています。このロジックを拡張して、新しい選択ボックス (「Other1」のオプション付き) と対応する INPUT ボックスを含める必要があります。

だから、あなたは次のようなことをする必要があるかもしれません...

<SCRIPT TYPE="text/javascript">
function toggleField(val) {
  var o = document.getElementById('other');
  var o1 = document.getElementById('other1');
  (val == 'Other')? o.style.display = 'block' : o.style.display = 'none';
  (val == 'Other1')? o1.style.display = 'block' : o1.style.display = 'none';
}
</SCRIPT>

これにより、同じ機能が最初の SELECT から 2 番目に拡張されます。

于 2012-05-22T20:36:36.680 に答える