当滚动包含 FilteringSelect 或 ComboBox 的页面时，Dojo 下拉列表分离
由于 ComboBox 和 FilteringSelect 使用“dijitPopup”，其 DOM 元素会插入到结束 body 标记之前（大概是为了帮助确保它出现在 z 索引方面的其他所有内容之上），这意味着如果 ComboBox 包含在以下元素中：独立于窗口本身滚动，用户打开下拉菜单，然后使用滚轮滚动窗口（或任何包含元素），菜单部分不会随控件本身移动。
是否有一种直接的方法来确保视图的菜单部分相对于控件本身保持正确的位置，而不是简单地假设其起始位置正确？
编辑：似乎是一个已知问题（http://bugs.dojotoolkit.org/ticket/5777）。我理解为什么他们将 dijit 弹出窗口放在结束正文标记之前，以解决 z 索引堆叠和溢出剪切问题，但考虑到此处存在问题，这似乎不是理想的处理方法，例如：
您可以将 Dijit 主题限制为页面的一小部分；你 通过将主题的 CSS 类应用到块级来做到这一点 元素，例如 div。但是，请记住，任何基于弹出窗口的 小部件（或使用弹出窗口的小部件，例如 dijit.form.ComboButton， dijit.form.DropDownButton 和 dijit.form.Select）创建并放置 弹出窗口的 DOM 结构作为主体的直接子级 元素 - 这意味着您的主题将不会应用于弹出窗口。
〜来自 http://dojotoolkit.org/documentation/tutorials/1.6/themes_buttons_textboxes/
Since the ComboBox and FilteringSelect use a 'dijitPopup' whose DOM element gets inserted just before the closing body tag (presumably to help with ensuring it appears above everything else z-index-wise) this means that if the ComboBox is contained in an element that scrolls independent of the window itself and the user opens the dropdown and then scrolls the window (or whatever containing element) using the scroll wheel, that the menu part doesn't move with the control itself.
Is there a straightforward way to ensure that the menu part of the view remains positioned correctly relative to the control itself rather than simply assuming that its starting position is ok?
EDIT: appears to be a known issue (http://bugs.dojotoolkit.org/ticket/5777). I understand why they put the dijit popup just before the closing body tag for z-index stacking and overflow clipping issues, but it seems like it's maybe not the ideal way to do things given the bug in question here and things like:
You can restrict the Dijit theme to only small portions of a page; you
do this by applying the CSS class of the theme to a block-level
element, such as a div. However, keep in mind that any popup-based
widget (or widgets that use popups, such as dijit.form.ComboButton,
dijit.form.DropDownButton, and dijit.form.Select) create and place the
DOM structure for the popup as a direct child of the body
element—which means that your theme will not be applied to the popup.
~ from http://dojotoolkit.org/documentation/tutorials/1.6/themes_buttons_textboxes/
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
不确定这是否是最好的解决方案，但这就是我想到的：
由于可以以编程方式添加/删除小部件，并避免将解决方案与某些特定的周围标记耦合，而我们不能在所有情况下总是依赖这些标记，我所做的是挂钩 ComboBox 的 _showResultList 和 _hideResultList 方法，当弹出窗口打开时，向上遍历 DOM 直到到达
标记，添加每个祖先的 onscroll 侦听器。onscroll 事件的处理程序很简单：
其中
this是有问题的小部件。我使用dojo.hitch将处理程序范围限定为小部件。在 close 方法中，我删除了侦听器。在代码可以呈现之前，我必须稍微清理一下代码，但是当它最终确定时，我会将其添加到这个答案中。注意：我在这里只显示更新 y 位置。清理工作的一部分是添加 x 位置更新，以防有人水平滚动。
Not sure if this is the very best solution, but here's what I came up with:
Since the widget may be programmatically added/removed, and to avoid coupling a solution with some particular surrounding markup that we can't always count on in all cases, what I did was to hook the _showResultList and _hideResultList methods of ComboBox and when the popup opens, traverse up the DOM till we reach the
<html>tag, adding onscroll listeners on each ancestor.The handler for the onscroll event is simply:
where
thisis the widget in question. I scope the handler to the widget usingdojo.hitch. In the close method I remove the listeners. I have to clean up the code a bit before it's presentable, but when it's finalized I'll add it to this answer.Note: I only show updating the y position here. Part of the cleanup is to add x position updating in case someone scrolls horizontally.
虽然它已经很老了，但我也遇到了同样的问题，它看起来像是一个 Dojo 问题，可以在此处进行修复 https ://bugs.dojotoolkit.org/changeset/30911/legacy
Though its old I just faced this same problem and it looks like a Dojo issue and the fix is available here https://bugs.dojotoolkit.org/changeset/30911/legacy