在下拉框中使用.change（）

Question

我有一个下拉框，我正在设置另一个事件。这就是我设置HTML的方式：

      <p> Please select a number:
<select name="selectNumber" id="selectNumber">
  <option value="1" <%if (number.equals("1")) {%>selected<%}%>>1</option>
  <option value="2" <%if (number.equals("2")) {%>selected<%}%>>2</option>
  <option value="3" <%if (number.equals("3")) {%>selected<%}%>>3</option>
  <option value="4" <%if (number.equals("4")) {%>selected<%}%>>4</option>
  <option value="5" <%if (number.equals("5")) {%>selected<%}%>>5</option>
  <option value="6" <%if (number.equals("6")) {%>selected<%}%>>6</option>
</select>
</p>
<div id="orgDiv">
   <p> HELLO!! </p>
</div>

这是我的jQuery：

        $(document).ready(function() {
      $('#orgDiv').hide()
    });
    $('#selectNumber').change(function(){
      $('#orgDiv').show();
    });

因此，当DOM完成加载时，它显然隐藏了div。我遇到的问题是，只要我点击下拉框......就会显示div。它不会等到我在下拉列表中选择某些内容。还有其他可以使用的事件吗？

Answer 1

您需要在文档准备中侦听更改事件。

   $(document).ready(function() {
      $('#orgDiv').hide()
      $('#selectNumber').change(function(){
        $('#orgDiv').show();
      });
    });