javascript - Bootstrap Datepicker 上的 Jquery .closest() 返回未定义

Question

我正在使用 Bootstrap Datepicker当在模式外单击时，我试图关闭弹出窗口。我遇到的问题是点击表格 <td>当我使用 $(e.target).closest('.datepicker') 时，元素不会返回其父 div .如果我单击它周围的蓝色框(也是一个子元素)，它会返回父 div，但不会返回表中的点击。

http://jsfiddle.net/tuG6C/662/

JS

$('body').click(function(e){
    console.log($(e.target).closest('.datepicker')[0]); 
});    

$(document).ready(function() {
    $('.datepicker').datepicker({
        startDate: new Date()
    });
});

HTML

<div class="datepicker"></div>

CSS

.datepicker {
    padding: 20px;
    background: aliceblue !important;
    display: inline-block;
}
table {
    background: #fff;
}

问题的截屏。我试图避免 undefined输出。

Answer 1

我遇到了完全相同的问题。经过几个小时的挫折，发现它不起作用，因为点击的目标不在您期望的位置(在 '.datepicker' 下)。

相反，被点击的 <td> 的父级是 <tr>没有 parentNode ，这使得确定我们是否在弹出窗口中非常困难 - 可以尝试搜索 DOM 来定位该元素，但我什至不知道它是否会存在。

这里使用的解决方案是检查是否

$(e.target).closest('body').length == 0

在这种情况下，弹出窗口保持打开状态

参见 this issue