如何防止使用Javascript在页面滚动上折叠Kendo下拉列表？

我面临一个奇怪的问题，并试图实施3个解决方案，但它没有为我解决。如何防止使用Javascript在页面滚动上折叠Kendo下拉列表？

问题在于外部页面滚动上的kendo dropdown折叠的默认功能。我想防止崩溃并做了一些研究。

我有一个解决方案here，以防止这一点，但这种下有显示的预览部分工作正常，但同样是没有根据道场（右上方链接），并在实际项目中工作。

没有区别，我可以看到防止下拉的塌陷在预览，而不是在道场。

请帮我解决一样，因为我是在剑道的新手。

来源

2016-03-30 Saggy

我建议你在Telerik论坛中创建一个帖子。我分析了预览代码和dojo，它是一样的。 –

我相信你需要处理小部件的事件关闭以控制此行为。下面是一个例子：

<input id="dropdownlist" /> 
    <script> 
     $("#dropdownlist").kendoDropDownList({ 
      dataSource: [ "text1", "text2" ], 
      close: _myClose.bind(this) 
     }); 

     var _myClose = function (e) { 
      var wish = true; 
      var element = e.sender; 
      if (wish) { 
       e.preventDefault(); 
      } 
     }; 
</script>

我绑定这个，这样就可以有优势的类属性。如果你愿意，你可以删除它。 kendo插件实例在e.sender对象下可用。

这是链接到Docs。希望它有帮助。

来源

2016-03-31 18:08:49 Ron

$(".k-list-container").each(function() { 
    var elementId = this.id.split("-")[0]; 
    var widget = $("#" + elementId).data("kendoDropDownList"); 
    if (widget) { 
     widget.ul.parent().on("wheel", function (e) { 
      var container = this; 
      if ((container.scrollTop == 0 && e.originalEvent.deltaY < 0) || 
       (container.scrollTop == container.scrollHeight - container.offsetHeight && e.originalEvent.deltaY > 0)) { 
       e.preventDefault(); 
       e.stopPropagation(); 
      } 
     }); 
    } 
});

来源

2017-07-31 10:05:08

这将工作像魅力！ –

我发现这个简单的代码片段作为剑道下拉列表打开，鼠标悬停在列表中的选项来禁用可靠，只要滚动页面。

// Fix annoyance where entire page scrolls when you scroll to the bottom of a dropdown 
$(document).bind('mousewheel DOMMouseScroll', function (e) { 
    var kendoDropdownBoxes = $('.k-list-container[style*="display: block"]'); 
    if (kendoDropdownBoxes.length > 0 && kendoDropdownBoxes.is(':hover')) { 
     $("body").css("overflow", "hidden"); 
    } else { 
     $("body").css("overflow", "auto"); 
    } 
});

来源

2017-08-15 15:53:33

如何防止使用Javascript在页面滚动上折叠Kendo下拉列表？

回答

相关问题