Javascript 使用引导下拉菜单选择项目

我想为引导下拉框编写javascript代码，但我不知道如何引用下拉框中的项目。当我编写if语句时，没有我可以引用的ID或类，比如if item1被选中或为true{something accounts}。如何参考第1项、第2项或第3项

 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
    <li role="presentation" class="item1"><a role="menuitem" tabindex="-1" href="javascript:void(0)">item1</a></li>
    <li role="presentation" class="item2"><a role="menuitem" tabindex="-1" href="javascript:void(0)">item2</a></li>
    <li role="presentation" class="item3"><a role="menuitem" tabindex="-1" href="javascript:void(0)">item3</a></li>

  </ul>

    $('.dropdown-menu li').on('click', function(){
       if($('.dropdown-menu li.item1')){
            $('item1Box').fadeTo(200, 0);
           }
    });

---

您可以根据自己的需求定制一点。因此，例如，您可以在下拉列表的更改事件期间在选定值上添加自定义类，并将其设置为选定

$('.dropdown-menu li').on('click', function(){
    //Remove previously selected 
    $('.dropdown-menu li').removeClass("selectedValue");
    //Add selected flag to current element
    $(this).addClass("selectedValue");
});

您可以在任何情况下使用

$('.dropdown-menu li.selectedValue');

或者，您还可以根据需要将自己的类和id添加到引导下拉列表中

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
    <li role="presentation" class="first-value"><a role="menuitem" tabindex="-1" href="#">item1</a></li>
    <li role="presentation" class="second-value"><a role="menuitem" tabindex="-1" href="#">item2</a></li>
    <li role="presentation" class="third-value"><a role="menuitem" tabindex="-1" href="#">item3</a></li>
  </ul>

---

我想你可以做切换和case li.value=item1。。。。。。 也许你应该把value=item1放在li元素中——或者更确切地说，去掉那些链接，通过Javascript/jquery来实现。我有类似于switchli的东西。value{item1:$dropdown-menu.attraction，page1.html；$dropdown-menu.submit；break；item2:…}我认为那些li被索引了，或者服务器知道taht-item1是第一个。。。然后触发form=dropdown submit（提交）之类的东西

---

根据你说的，我重写了。请参阅第页顶部的代码。选择item1时，我希望显示的dropbox当前具有不透明度：0应淡入可见，但不显示任何内容。为什么呢？

  <div class="dropdown">
        <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Dropdown trigger
          <span class="caret"></span>
        </button>
        <ul class="dropdown-menu pres" role="menu" aria-labelledby="dLabel">
          <li role="presentation" class="item1"><a role="menuitem" tabindex="-1" href="#)">item1</a></li>
          <li role="presentation" class="item2"><a role="menuitem" tabindex="-1" href="#">item2</a></li>
          <li role="presentation" class="item3"><a role="menuitem" tabindex="-1" href="#">item3</a></li>
        </ul>
      </div>
<script>
$(document).ready(function() {
  $(".pres").children().click(function(){
    $(this).fadeTo(200, 0);
  });
});
</script>