javascript - Bootstrap 下拉菜单在单击时隐藏 选择隐藏下拉菜单

Question

点击下拉菜单中的选择，下拉菜单将隐藏 Bootstrap 下拉菜单，当我在选择下拉菜单中选择某些内容时，我不想隐藏

<li> <a href="#"  data-toggle="dropdown" aria-haspopup="true" class="myr-text" aria-expanded="false"> <img src="images/flag-icon.jpg" alt=""> / MYR / English</a>
              <ul class="dropdown-menu select-dropdown-menu">

                <li><p>Regional settings for your next visit</p></li>
                <li role="separator" class="divider"></li>
                <li><form class="form-horizontal" role="form">
                    <select id="basic" class="selectpicker show-tick form-control" data-live-search="true">
                      <option selected> Malaysia </option>
                      <option> Malaysia 01 </option>
                      <option> Malaysia 02 </option>
                      <option> Malaysia 03 </option>
                      <option> Malaysia 04 </option>
                    </select>
                  </form></li>
                <li><form class="form-horizontal" role="form">
                    <select id="basic" class="selectpicker show-tick form-control" data-live-search="true">
                      <option selected> Malaysian Ringgit (RM) </option>
                      <option> Malaysian Ringgit (RM) 01 </option>
                      <option> Malaysian Ringgit (RM) 02 </option>
                      <option> Malaysian Ringgit (RM) 03 </option>
                      <option> Malaysian Ringgit (RM) 04 </option>
                    </select>
                  </form></li>
                <li><form class="form-horizontal" role="form">
                    <select id="basic" class="selectpicker show-tick form-control" data-live-search="true">
                      <option selected> English </option>
                      <option> Urdu </option>
                      <option> Punjabi </option>
                      <option> Pashtoo </option>
                    </select>
                  </form></li>

              </ul>
            </li>

这是我用于显示和隐藏的 jquery 代码

$("body .social-nav li ul.dropdown-menu").click(function(event) {
$(this).closest('.social-nav li').addClass("open-deopdown");
    });

$(body).click(function(event) {
$(this).closest('body ul.social-nav li').removeClass("open-deopdown");
    });

Answer 1

试试这个:

$('body').click(function(event){
     if($(event.target).closest('.open-dropdown').length==0)
     {
        $('li').removeClass("open-dropdown");

         }
    });

$('.myr-text').click(function(){
    $(this).closest('.social-nav li').toggleClass("open-dropdown");
    });