2016-06-29 2 views
1

Когда я использую multiselect самостоятельно, он работает хорошо.Bootstrap multiselect, используемый в выпадающем меню Bootstrap

но когда я помещаю его в раскрывающееся меню начальной загрузки, как мы знаем, если мы нажмем на раскрывающееся меню, это окно будет закрыто.

поэтому я использую stopPropagation(), чтобы остановить процесс перехода по событию в раскрывающееся меню, однако при этом многоселектор не работал, а «test» может вызвать функцию test() правильно.

мой код выглядит следующим образом:

<ul class='dropdown-menu dropdown-menu-right'> 
    <li> 
    <div class='container-fluid'> 
     <div class='row' id='filter-container'> 
     <div class='col-md-12'> 
      <h4><a onclick='test();'>test</a></h4> 
      <select id='example-getting-started' multiple='multiple'> 
      <option value='aaaaaa'>bbbbbb</option> 
      <option value='cccccc'>cccccc</option> 
      <option value='dddddd'>dddddd</option> 
      <option value='eeeeee'>eeeeee</option> 
      </select> 
     </div> 
     </div> 
    </div> 
    </li> 
</ul> 




$('#filter-container').click(function(e) { 
    e.stopPropagation(); 
}); 
+0

Какая у вас функция test()? – Ctc

+0

@Ctc test() - это простое оповещение. function test() {alert ('1');} – YinweiLi

ответ

0

я наткнулся на такой же проблемой и нашел this самозагрузки плагин, который берет на себя все это. Он откроет раскрывающееся меню для множественного выбора. Фрагмент кода, кажется, есть вопросы рг

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://raw.githubusercontent.com/silviomoreto/bootstrap-select/master/dist/css/bootstrap-select.min.css" rel="stylesheet"/> 
 

 

 

 
<select class="selectpicker" multiple> 
 
    <option>Mustard</option> 
 
    <option>Ketchup</option> 
 
    <option>Relish</option> 
 
</select> 
 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<script src="https://raw.githubusercontent.com/silviomoreto/bootstrap-select/master/dist/js/bootstrap-select.min.js"></script>

сниппет, кажется, есть проблемы Предоставляющие mutliselect правильно.

+0

ну, моя сцена - это когда я выставляю в раскрывающемся меню выбор начальной загрузки или bootstrap-multiselect, он не работает, поскольку внешний контейнер будет закрыт. – YinweiLi

0

вывод:

@see dropdown source link

события выпадающего будет proppagating к документу, как

$(document) 
    .on('click.bs.dropdown.data-api', clearMenus) 
    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() }) 
    .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle) 
    .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown) 
    .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown) 

}(jQuery); 

поэтому не имеет никакого способа поставить MULTISELECT в раскрывающемся меню Bootstrap.

Смежные вопросы