jQuery:单击&x27;不使用下拉菜单选项

jQuery:单击&x27;不使用下拉菜单选项,jquery,drop-down-menu,click,Jquery,Drop Down Menu,Click,所以我想做的是,当从下拉菜单中选择某个选项时,显示当前隐藏的自定义字段,但似乎无法实现这一点。或者换句话说,在单击特定的选项之后,我想将当前隐藏字段上的CSS从display:none更改为display:block 我已经用下面的代码实现了在点击选择菜单的任意位置后显示自定义字段,但这还不够。仅当选择特定选项时,才会显示隐藏字段 所以这是有效的 jQuery('#select-menu').click(function() { jQuery('.custom-field-wrapper')

所以我想做的是,当从下拉菜单中选择某个
选项时,显示当前隐藏的自定义字段,但似乎无法实现这一点。或者换句话说,在单击特定的
选项之后,我想将当前隐藏字段上的CSS从
display:none
更改为
display:block

我已经用下面的代码实现了在点击选择菜单的任意位置后显示自定义字段,但这还不够。仅当选择特定选项时,才会显示隐藏字段

所以这是有效的

jQuery('#select-menu').click(function() {
  jQuery('.custom-field-wrapper').css('display', 'block');
});
但这不

jQuery('#select-menu option:last').click(function() {
  jQuery('.custom-field-wrapper').css('display', 'block');
});

知道我做错了什么,以及如何修复或解决这个问题吗?

您不能将click event listener添加到选项中,而是必须检查select的值,并做出相应的反应: 像这样的方法应该会奏效:

jQuery('#select-menu').on('click change', function() {
  if ($(this).val() === 'targetValue') {
    jQuery('.custom-field-wrapper').css('display', 'block');
  } else {
    jQuery('.custom-field-wrapper').css('display', 'none');
  }
});
可能重复的