Когда пользователь щелкает опцию в раскрывающемся меню Bootstrap Multiselect, запускается Bootstrap Toggle (http://www.bootstraptoggle.com/) Элемент НИЖЕ.
Я не уверен, относится ли эта проблема к Bootstrap Multiselect и /или Bootstrap Toggle, или взаимодействие двух - это единственный элемент в моем приложении, который перекрывает / скрывает другие элементы.
Плагин прекрасно работает ... просто когда вы нажимаете Алгебра (1 ниже) или действительно любой параметр в раскрывающемся списке, ниже приведены переключатели Bootstrap (2 на снимке экрана), как если бы вы щелкнули по ним напрямую.
Как предотвратить это без проверки налогика «видеть, если многократно выбранный»?
Добавление HTML для решения вопроса ... div были внутри одного родительского divи я переместил их в отдельные элементы Div ... тот же результат: нажатие на выпадающий множественный выбор запускает слушателя в класс wordPref
.
<div class="row paddingMenu">
<div class='col-xs-12 alignleft'>
<b>Select</b> from <i>active</i> Libraries<a data-toggle="tooltip" data-placement="bottom" title="Click EDIT then ACTIVATE LIBRARIES to add and remove Libraries." tabindex="-1" class="pull-right"><span class="glyphicon glyphicon-info-sign pull-right" style="font-size: 15px"></span></a>:
</div>
<div class='col-xs-12 aligncenter'>
<div class='form-group'><select id='ddLibName' multiple='multiple'></select>
<div id='ddLibrarySelect'></div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-4 aligncenter" data-toggle="tooltip" data-placement="bottom" title="Choose whether to insert selected Comments as Word comment bubbles OR inline text.">
<input type="checkbox" id="insertMode" class="wordPref" data-toggle="toggle" data-size="small"
data-off="Inline" data-on="Comment"
data-offstyle="info" data-onstyle="success">
</div>
<div class="col-xs-4 aligncenter" data-toggle="tooltip" data-placement="bottom" title="Save document owner/author info with your usage statistics. This setting may be defined by your institution.">
<input type="checkbox" id="logMode" class="wordPref" data-toggle="toggle" data-size="small"
data-off="History OFF" data-on="History ON"
data-offstyle="info" data-onstyle="success">
</div>
<div class="col-xs-4 aligncenter">
<a class="btn btn-primary btn-sm" id="refreshBtn" data-toggle="tooltip" data-placement="bottom" title="Refresh AP to pull down any content changes or purchases." tabindex="-1">Refresh</a>
</div>
<div id='upsellMsgDiv' class='apSidebarAlert col-xs-12 hide'>
<div class="spacer-5"></div>
<div class="panel panel-warning">
<div class="panel-body highlight-cell">
<span class="apAlertMsg"></span>
<div id='closeAlertBtn' class='col-xs-12 spacer-5 hide'>
<button class='btn-sm btn-primary closeSidebarAlert pull-right' type='button'>Close</button>
</div>
</div>
</div>
</div>
</div>