Я оформляю несколько элементов Select с помощью неупорядоченных () списков HTML, и эта функция должна скрывать эти элементы, когда пользователь щелкает в любом месте за пределами области элемента, но по какой-то причине она не работает, когда пользователь щелкает элементы, которые используют виджет jQuery UI MultiSelect.
ОБНОВЛЕНИЕ. Я создал jsfiddle, чтобы продемонстрировать проблему http://jsfiddle.net/chayacooper/ezxSF/4/ Нажмите, чтобы открыть элемент с пометкой 'Элемент UL'. Если вы наведете указатель мыши на любой из раскрывающихся элементов для 'Элемент UL' или щелкнуть документ или другой элемент, он работает должным образом, но остается открытым, если щелкнуть 'MultiSelect Element', не наведя указатель мыши на какой-либо из 'элементов UL'< /em> предметы.
$('html').click(function(e){
if(e.target.id == 'dropdown_box1') {
$("#select1").show();
} else {
$("#select1").hide();
}
});
Я также пытался создать отдельную функцию для закрытия этого элемента, если пользователь нажимает на элемент с множественным выбором, но это тоже не сработало.
$('.multiselect').click(function() {
$("#select1").hide();
});
HTML
<div id="dropdown_box1"><span>Select</span></div>
<div class="dropdown_container" id="dropdown_container1">
<ul id="select1">
<!-- Several List Item Elements -->
</ul>
</div>
У меня есть отдельная функция mouseleave, которая скрывает элемент списка, когда пользователь наводит на него указатель мыши, но не срабатывает, если пользователь щелкает, чтобы открыть его, но не наводит указатель мыши на элемент списка.
$(document).ready(function () {
$("#dropdown_box1").click(function () {
$("#select1").show();
});
var timeoutID;
$("#select1").mouseleave(function () {
timeoutID = setTimeout(function () {
$("#select1").hide();
}, 800);
});
$("#select1").mouseenter(function () {
clearTimeout(timeoutID);
});
});
