У меня есть боковое меню, которое открывается, когда пользователь наводит курсор на него.В одном разделе, когда пользователь нажимает на элемент меню, рядом с ним открывается всплывающее окно.
Но когда вы переходите на поповер, чтобы выбратьВ раскрывающемся меню всплывающее меню закрывается и покидает всплывающее окно.Я попытался использовать stopPropagation (), но меню все еще закрывается.
Есть идеи, как решить эту проблему?
<li class="active treeview menu-open" id="testExecution">
<!-- sidebar menu item 1: Test Execution -->
<a>
<i class="fa fa-bars"></i> <span>Test Execution</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<!-- sidebar submenu -->
<li class="active treeview menu-open" id="partnersTree" onclick="closePopovers()">
<a>
<i class="fa fa-circle-o"></i> <span>Partners</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li class="active" id='tab1'><a><i class="fa fa-circle"></i> tab1</a></li>
<li id='tab2'><a><i class="fa fa-circle"></i>tab2</a></li>
<li id='tab3'><a><i class="fa fa-circle"></i> tab3</a></li>
</ul>
</li>
<li class="treeview" id="historySettings">
<a>
<i class="fa fa-circle-o"></i> <span>History Settings</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a id="versionHistory" data-container="body" data-toggle="popover" data-placement="right">
<i class="fa fa-gear"></i> <span>Version History</span>
<span class="pull-right-container">
<i class="fa fa-angle-right pull-right"></i>
</span>
</a>
</li>
<div class='_content' id='versionHistoryPicker' style='width:250px'>
<div class="form-group">
<label>Select Version:</label>
<select class="form-control" id="versionDropdown" style="background-color:#ffffff; color:#777777" >
<option selected="selected" disabled="true"> Please Select Version </option>
</select>
</div>
<button type="submit" class="btn btn-default btn-block" onclick="drawHistoryCharts()">Submit</button>
</div>
<li><a id="dateHistory" data-container="body" data-toggle="popover" data-placement="right">
<i class="fa fa-gear"></i> <span>Date History</span>
<span class="pull-right-container">
<i class="fa fa-angle-right pull-right"></i>
</span>
</a>
</li>
<div class='_content' id='dateHistoryPicker' style='width:250px'>
<div class="form-group">
<label>Date range:</label>
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<input type="text" class="form-control pull-right" id="reservation">
</div>
</div>
<button type="submit" class="btn btn-default btn-block" onclick="dateHistoryChart()">Submit</button>
</div>
<li><a onclick="onLoad()">
<i class="fa fa-refresh"></i> <span>RESET PAGE</span>
<span class="pull-right-container">
</span>
</a>
</li>
</ul>
</li>
</ul>
<script type="text/javascript">
$("#testExecution").mouseout(
function(e) {
event.stopPropagation();
});
</script>