Handsontable 弹出式自动完成编辑器在水平滚动条处被切断答案

【问题标题】：Handsontable popup autocomplete editor gets cut off at horrizontal scrollbarHandsontable 弹出式自动完成编辑器在水平滚动条处被切断
【发布时间】：2014-12-06 02:49:58
【问题描述】：

我在所有列上都有自动完成功能。正如您在这个 jsfiddle http://jsfiddle.net/tomkast/ub5vbsdp/ 中看到的那样，自动完成编辑器被水平滚动条截断。

some code required by stackoverflow to post the jsfiddle link

也许问题是这里描述的：http://css-tricks.com/popping-hidden-overflow/

我在这个问题上工作的时间太长了（我的老板这么说）所以如果你有任何想法/jquery 解决方法，我很想知道......

【问题讨论】：

-1 因为缺乏研究？尝试 72 小时的研究... .. 不明显，因为我没有在此处包含代码？在这里添加一些 js 代码的无偿部分似乎是无偿的，所以我将代码留在了 jsfiddle 上——这就是 -1 的含义吗？

标签： javascript jquery css handsontable

【解决方案1】：

似乎您必须采取一种解决方法才能使其正常工作，但这是可能的。正如您在this topic 中看到的，您需要在父项中拥有overflow: auto;，在子项中拥有position: fixed;。

这可能稍后会出现问题，但在这种情况下没有其他 position 设置有效，所以我们希望它不会。 Here's the working fiddle

【讨论】：

虚幻的。它完美地工作。太感谢了。我向您表示 100% 的感谢。
这里还有一个问题。我需要补偿视口 div 的滚动。我尝试将 top 和 left 添加到 autocompleteEditor css，然后使用 jquery 动态更新这些值，但我遇到了各种问题。看来我需要了解 autocompleteEditor 的定位方式。当我们离开它时，CSS 是 position:fixed;并且没有顶部或左侧。那么 HOT 是如何在屏幕上移动它的呢？一旦我理解了这一点，我就可以使用 beforeKeyDown: function (e) {} 并减去 $('#content')[0].scrollTop ，它运行良好....
对于任何感兴趣的人，我发现一个 div 是 autocompelteEditor $('.handsontableInputHolder') 的父级，它有一个绝对的顶部和左侧可以使用。但是简单地抓住这些值并将它们分配给 autocompleteEditor 的顶部/左侧，并使用 init 回调破坏了一些其他定位逻辑......类似于 beforeKeyDown: function (e) { $('.autocompleteEditor').css('top' , ($('.handsontableInputHolder')[0].offsetTop - $('#content')[0].scrollTop) + 'px');}