jQuery选择器不选择任何内容。

Question

我有一些HTML

 <select id="dropd" class="search-type" data-toggle="dropdown">
     <option value="">All</option>
     <option value="standards-and-publications">Standards</option>
     <option value="sedl-digital-library">Library</option>
 </select>

以及我用来尝试选择此下拉菜单并向其应用按键侦听器的这个小型js函数。 但是我在下面获取此代码有麻烦

$('.search-type').on('show.bs.dropdown', function () {
     alert("I FINALLY FOUND YOU");
});

在显示下拉菜单时运行（在这种情况下单击）。 我是否需要将其包装在事件监听器中以监听点击？ 我实际上已经尝试过这种方法，但是当用户单击下拉列表时，仍然无法使它显示此消息或以任何方式做出反应。 根据我在调试器中进行此操作时所看到的内容，它永远不会解析类选择器，但这只是一个猜测。 使用选择器时，我是否明显缺少某些东西或一些奇怪的引导程序规则？

如果我没有提供足够的信息，我也表示歉意，因为我对此还比较陌生，并且不确定到底发生了什么。

Answer 1

参见此处以获取答案： 在Bootstrap中使用show.bs.dropdown的过程

基本上，事件是由下拉列表的父级处理的，而不是下拉列表本身。 另外，BootStrap下拉列表通常为<ul> 。 这是带有处理程序的标准下拉列表的示例：

的HTML

<div class="btn-group" id="ddlWrap">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Menu
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <li><a href="#">Choice1</a></li>
    <li><a href="#">Choice2</a></li>
    <li><a href="#">Choice3</a></li>
    <li class="divider"></li>
    <li><a href="#">Choice..</a></li>
  </ul>
</div>

JS

$('ddlWrap').on('show.bs.dropdown', function () {
    alert('Found the dropdown wrapper!');
});

Answer 2

我认为事件在父级上触发，因此应该是.dropdown上方的元素，因此您的代码应该是

    <div class="btn-group" id="myDropdown">
       <select id="dropd" class="search-type" data-toggle="dropdown">
         <option value="">All</option>
         <option value="standards-and-publications">Standards</option>
         <option value="sedl-digital-library">Library</option>
       </select>
    </div>