jquery ui 自动完成出现在页面底部

Question

我在 jquery ui 自动完成方面遇到了一个奇怪的问题，直到我必须打印页面之前我从未注意到它。

每当我使用 jquery ui 自动完成功能时，它都会将其放入我正在使用的输入中，这是它应该做的事情，但由于某种原因，它也会将其放在页面主体下。您看不到它，直到您进入打印预览，然后它才会显示。这很烦人，因为我需要能够打印我的页面而不显示该页面。

现在我知道这不是我的 html 缺少 div 或任何东西，因为它在每个页面上都会这样做，并且页面的格式完全不同。

我正在使用 jquery 3.0.0 和 jquery ui v1.12.0

我的输入在大多数页面上都很正常，例如

<input type="text" id="searchcash" placeholder="Search by Reference or Reason" size="50" Value="">

我的 jquery 代码也非常标准

$("#searchcash").autocomplete({
    source: "ajax/cash.php",
    minLength: 2,//search after two characters
        select: function(event,ui){
            $('#line_id').val(ui.item.id);  
        },
        change: function (event, ui) {
            if (!ui.item) {
                $(this).val('');
            }
        }

不知道有没有人遇到过这个问题，并且能够解决。我想知道更改为更新的 jquery ui 是否可以解决这个问题，但我想我应该先问一下。

Answer 1

Rory 让我明白了正确的想法，但这里是隐藏自动完成功能以防止在页面底部打印的实际代码。

我把它放在我的 print.css 覆盖中，它阻止它把自动完成用户界面放在页面底部。

.ui-helper-hidden-accessible{
    display:none !important;
}

如果有更好的方法来做到这一点，我将最感兴趣，直到那时这将是答案。我不知道为什么自动完成必须位于底部，但这在短期内解决了我的问题，但肯定应该有更好的方法。