jquery基于选择选项显示div

我目前正在处理一个小表单，仅当选择了某个元素时，我才想显示（切换）一个特定的div

这是我的代码：

        <select name="options">
          <option value="">-Please select-</option>
          <option value="buffet">Buffet</option>
          <option value="serviced">Serviced Menu</option>
        </select>

-请选择-
自助餐
服务菜单

理想情况下，隐藏的div应该仅在选择“Buffet”选项时切换

你知道我怎样才能完成这个任务吗？一些专家的建议将不胜感激。

请这样做：

HTML:

<select name="options">
    <option value="">-Please select-</option>
    <option value="buffet">Buffet</option>
    <option value="serviced">Serviced Menu</option>
</select>

<div id="somediv">
    Lorep Ipsum
</div>

$('select[name="options"]').on('change',function(){
  if ($(this).val().trim() == "buffet") {
    $('#somediv').show();
  } else {
    $('#somediv').hide();
  }
});

演示：

<select name="options">
    <option value="">-Please select-</option>
    <option value="buffet">Buffet</option>
    <option value="serviced">Serviced Menu</option>
</select>

<div id="somediv">
    Lorep Ipsum
</div>

$('select[name="options"]').on('change',function(){
  if ($(this).val().trim() == "buffet") {
    $('#somediv').show();
  } else {
    $('#somediv').hide();
  }
});

试试这个：

  $('select[name="options"]').change(function(){
     if($(this).val()=="buffet")
         $('#somediv').show();
     else
         $('#somediv').hide();
  });

试一下：

$('select[name="options"]').on('change', function(){
  $('#hiddenDiv').toggle( $(this).val() == 'buffet' );
});

使用

.change（）

事件