单击日期选择器外部的已知容器时，有没有办法可以防止剑道日期选择器日历弹出窗口关闭？答案

【问题标题】：Is there a way I can prevent a kendo datepicker calendar pop-up from closing when clicking on a known container which is outside of the datepicker?单击日期选择器外部的已知容器时，有没有办法可以防止剑道日期选择器日历弹出窗口关闭？
【发布时间】：2014-06-12 14:32:24
【问题描述】：

我正在使用 kendo 日期选择器，并且我在弹出日历的底部添加了一个文本区域，供用户在更改日期时添加 cmets。我有 cmets 区域显示日期选择器何时显示，但是当我单击 textarea 输入 cmets 时，日历关闭。我尝试在日期选择器的关闭事件上使用 e.preventDefault() 但它永远不会关闭。

当单击日期选择器之外的已知容器时，有没有办法可以防止剑道日期选择器日历弹出窗口关闭？

代码：

HTML：

<div class="date-comment-wrapper">
    <textarea id="date-comment" cols="30" rows="5"></textarea>
    <button class="pull-right" id="date-change-submit">Submit Change</button>
</div>

CSS：

.date-comment-wrapper {
    padding: 10px;
    border: 1px solid #c5c5c5;
    width: 225px;
    position: absolute;
    top: 0px;
    left: 0px;
    display:none;
    background-color: white;
    border-radius: 0 0 4px 4px;
}

Javascript 定位在日期选择器下：

var commentDiv = $('.date-comment-wrapper'),
    paddingPlusBorder = 22,
    calendarTopElement = $('.k-animation-container'),
    width = parseFloat(calendarTopElement.css('width')) - paddingPlusBorder,
    height = parseFloat(calendarTopElement.css('height')),
    textArea = commentDiv.children('#date-comment'),
    top = parseFloat(calendarTopElement.css('top')),
    left = parseFloat(calendarTopElement.css('left'));

commentDiv.css({
    width: width,
    left: left,
    top: top + height
});

textArea.css({
    width: width - paddingPlusBorder
});

commentDiv.show();

剑道 HTML

<div id='datePicker' style='visibility: hidden; position: absolute;'></div>

剑道JS

$("#datePicker").kendoDatePicker({
    close: function() {    
        // Close the comment div
        $('.date-comment-wrapper').hide();
    },
    animation: false
});

【问题讨论】：

这个问题的剑道密码在哪里？
感谢您对此进行调查。我按照您的要求添加了剑道日期选择器代码。

标签： javascript css kendo-ui telerik kendo-datepicker

【解决方案1】：

我猜这个问题是因为你的div.date-comment-wrapper 包含textarea 和button 在弹出窗口之外（其代码未显示）并且与#datePicker 完全无关。

如果您将div.date-comment-wrapper 附加到您的弹出窗口，当您单击提交按钮时该窗口不应关闭。

【讨论】：