我有一个弹出窗口,在里面我有一个选择框,其中的选项超出了弹出窗口。所以,要关闭我的弹出窗口我需要在外面点击,问题是当我从外面的选择框中选择一个选项时,它的关闭也是弹出窗口:/
这是我的弹出窗口:
<div id="form-modal" style="display:none" >
<div id="form-modal-meeting" class="actions_" >
<div class="action_popup">
<div class="date-label" ><%= l(:priority) %></div>
<select class="list_cf" id="issue_custom_field_values_27" name="issue[custom_field_values][27]"><option value=""> </option><option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
</select>
</div>
</div>
</div>
这是我的关闭jquery函数:
var mouse_is_inside = false;
$(document).ready(function()
{
$('.action_popup').hover(function(){
mouse_is_inside=true;
// introJs().exit();
}, function(){
mouse_is_inside=false;
});
$("body").mouseup(function(){
if(! mouse_is_inside) {
if ($('#form-modal-watcher').css('display') == 'block') {
mouse_is_inside=true;
}
else {
$('#form-modal').fadeOut();
}
}
});
$('#ui-datepicker-div').hover(function(){
mouse_is_inside=true;
}, function(){
mouse_is_inside=false;
});
$( ".add_watcher_btn" ).click(function() {
mouse_is_inside=true;
});
});
答案 0 :(得分:1)
您最好使用event.target
方法检查jQuery::closest
元素,如果这是元素元素的后代。
$("body").mouseup(function(event){
if(isInside(event) === false) {
$('#form-modal').fadeOut();
}
});
function isInside (event) {
return $(event.target).closest('#form-modal').length !== 0;
}