一個#id的多重選擇選項以顯示n個隱藏表

Question

我對選擇選項有疑問。 我想顯示n隱藏我的表n div和具有相同ID的我的許多選擇選項，但結果僅在第一個選擇選項中有效。 我真的需要您的幫助，以便我所有的select選項都具有相同的ID。 幫幫我..！ ...

      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
      $(function() {
          $('#sts').change(function() {
                $('div.number').hide();
                $('table.number').hide();
                $('#number' + $(this).val()).show();
          }).change();
    });
</script>

...

  <select name="" id="sts" class="form-select required">


  <option value="">- select -</option>

  <option value="1">Option 1</option>

  <option value="2">Option 2</option>

  <option value="3">Option 3</option>

  <option value="4">Option 4</option>
  </select>

  <select name="" id="sts" class="form-select required">

  <option value="">- select -</option>

  <option value="1">Option 1</option>

  <option value="2">Option 2</option>

  <option value="3">Option 3</option>

  <option value="4">Option 4</option>
  </select>

  <div id="number1" class="number">Option 1</div>

  <div id="number2" class="number">Option 2</div>
  <div id="number3" class="number">Option 3</div>

Answer 1

嘗試

$('*#sts').change(function() {...});

Answer 2

通常，HTML元素的id屬性必須是唯一的。 因此，請將代碼更改為

<select name="" id="sts" class="form-select required">


  <option value="">- select -</option>

  <option value="1">Option 1</option>

  <option value="2">Option 2</option>

  <option value="3">Option 3</option>

  <option value="4">Option 4</option>
  </select>

  <select name="" id="sts1" class="form-select required">

  <option value="">- select -</option>

  <option value="1">Option 1</option>

  <option value="2">Option 2</option>

  <option value="3">Option 3</option>

  <option value="4">Option 4</option>
  </select>

  <div id="number1" class="number">Option 1</div>

  <div id="number2" class="number">Option 2</div>
  <div id="number3" class="number">Option 3</div>

現在使用代碼通過their class名稱獲取select元素來進行處理：

<script type="text/javascript">
      $('select.form-select').change(function() {

                $('div.number').hide();
                $('table.number').hide();
                $('#number' + $(this).val()).show();
          });
</script>