jQuery - 在选择选项更改时，显示/隐藏 DIV

jQuery - On Selection option change, show/hide DIV

本文关键字：显示 隐藏 DIV 选择 选项 jQuery      更新时间：2023-09-26

根据select列表中选择的选项，我想显示以下 DIV 之一：

<div id="field-person">Blah</div>
<div id="field-company">Blah 2</div>

这是我现在拥有的select和jQuery，当选择A person选项时，它应该显示#field-person，否则它应该保持隐藏状态：

<select name="sub_type" id="sub_type">
  <option value="company">A company</option>
  <option value="person">A person</option>
</select>
$(document).ready(function() {
  var f = $("#field-person");
  $("#sub_type").change(function() {
    if (this.checked && this.value == "person") {
      f.show();
    } else {
      f.hide();
    }
  }).change()
});

然而，当我选择person选项时，没有任何反应，选择company选项也是如此。没有变化，Chrome 控制台中没有任何内容。已经在这个问题上拔头发大约一个小时了，任何帮助将不胜感激，jQuery 不是我的强项！

这是我正在使用的实际代码的链接：JSFiddle

将 if 语句更改为：

if (this.value == "person") {
   ...
}

select元素没有 .checked 属性。所以this.checked返回undefined，这将使条件为假。

演示

相关文章：