jquery - 页面滚动时的剑道下拉列表定位问题？

Question

我正在使用自己的剑道。打开下拉菜单时，我在页面滚动时遇到问题。这是示例。

jsfiddle 演示

当剑道 ui 下拉菜单打开时，尝试使用鼠标滚轮滚动，剑道下拉列表将与其分离并随着滚动在页面上移动。有什么解决办法。要么让它在滚动时关闭，要么用下拉本身移动它（不脱离该元素）。

要在此链接中生成场景：

1. 打开下拉列表
2. 使用鼠标滚轮向上/向下移动页面。列表也将通过与元素分离来上下移动

非常感谢任何帮助。提前致谢

HTML

<div id="container">
    <p>Scroll down for the KendoDropDownList:</p>
    <br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
    <select id="select">
        <option value="1">item 1</option>
        <option value="2">item 2</option>
        <option value="3">item 3</option>
        <option value="4">item 4</option>
    </select>
    <br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

JS

$("#select").kendoDropDownList();

CSS

#container
{
    width:400px;
    height:200px;
    overflow:auto;
    position:fixed;
    top:100px;
    left:50px;
    border:1px solid #666;
}

html
{
    font:12px sans-serif;
}

Answer 1

检查此链接

在滚动时，只需从剑道启用关闭事件

http://jsfiddle.net/krustev/cQGrK/

   $(document.body).find("[data-role=popup]").each(function() {
   var popup = $(this).data("kendoPopup");
   popup.close();
   });

Answer 2

每当您尝试滚动时，下面的代码将使您的下拉列表关闭。

$('#ScrollingBox').scroll(function() {
   $("#YourDropdownListID").data("kendoDropDownList").close();
});