Javascript jQuery UI自动完成定位问题

我看到过其他一些类似的帖子，但没有真正回答这个具体问题。正在尝试在项目中使用现成的jQuery UI自动完成小部件。。它在我的输入下的位置很好，不像其他帖子说它从0,0开始，但是当我在显示自动建议结果的情况下上下调整窗口大小时，位置不会跟随窗口大小回流的输入框。它保持在调用时的位置。如果在输入中键入另一个字母，结果框将跳回输入下的正确位置，但窗口大小更改事件不会这样做？蒂亚

JS小提琴示例：

JAVASCRIPT:

$('input').autocomplete({
    search: function(event, ui) {
        $('section .test ul').empty();
    },
    source: ["something", "something-else"]
}).data('autocomplete')._renderItem = function(ul, item) {

    return $('<li/>')
   .data('item.autocomplete', item)
   .append(item.value)
   .appendTo($('section .test ul'));
};

---

设置为“自动”的边距是问题所在。如果您删除这两行

margin-left: auto;
margin-right: auto;

它起作用了。我认为在真实的页面上，您并不真正需要这些功能。

您可以添加一个窗口调整事件侦听器，然后调用。您可以在中看到这一点

一个好的添加位置是在中，因为在小部件创建期间只调用一次

它看起来是这样的：

$('input').autocomplete({
    ...
    ...
    create: function(event, ui) {
        var widget = $(this).data('ui-autocomplete');
        var ul = widget.menu.element;           
        var positionProps = $.extend({ of: widget.element }, widget.options.position);

        // reposition autocomplete dropdown when window resizes
        $(window).on('resize', function() {
            ul.position(positionProps);
        });
    },
    ...
    ...
});

---

如果删除这些，它会将div放在左/左，但在实际应用程序中，autocomplete框位于屏幕的右侧，因此该问题确实会导致问题。我只在那里留有空白来证明定位是正确的。不幸的是，这也不起作用，如果我从头开始构建一个工作环境，可能会起作用，但这是在一个企业应用程序中，在这个应用程序中，搜索框已经在一个预定义的区域中，我无法真正进行破解。我需要一个解决方案，将基本上工作，如果文本对齐设置为中心。如果应用程序没有响应，ta权限将起作用。我看到的另一个相同问题的例子是下面的URL，尽管看起来他也没有提供解决方案。一般来说，jQueryUI的定位错误似乎很严重，但我必须找到解决方法。我尝试了一下：但不幸的是，没有办法像打开方法那样手动重新打开该框

margin-left: auto;
margin-right: auto;

$('input').autocomplete({
    ...
    ...
    create: function(event, ui) {
        var widget = $(this).data('ui-autocomplete');
        var ul = widget.menu.element;           
        var positionProps = $.extend({ of: widget.element }, widget.options.position);

        // reposition autocomplete dropdown when window resizes
        $(window).on('resize', function() {
            ul.position(positionProps);
        });
    },
    ...
    ...
});