autoComplete标记出现在错误的位置

Question

我使用PrimeFaces和JSF来完成我的学校工作并使用jQueryUI Theme滚动来设置它的样式，并且特定标记：<p:autoComplete>在CSS处于活动状态时有错误（当我禁用css时它工作正常），这就是它的样子：bug

autoComplete应该在＆＃34; Modelo：＆＃34;旁边，但它在页面角落。

我已经使用＆＃34; autocomplete＆＃34;

找到了此代码

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    cursor: default;
}

同样的代码也出现在jquery-ui.css和jquery-ui.structure.css中。还有一些带有＆＃34; autocomplete＆＃34;的JavaScript代码，但它们很大，所以我把它们放在这个链接上： http://hostcode.sourceforge.net/view/4282

我不太了解CSS和Javascript，所以我请你们帮我解决这个问题。

仅供参考：我在p:autocomplete>内使用＆lt; <p:panelGrid>，对不起英文错误：）

Answer 1

解决这个问题要简单得多，我刚刚在css中更改.ui-autocomplete位置，从绝对到相对，当然，我已经在每个文件中更改.ui-autocomplete出现

Answer 2

使用jQuery和jQuery UI请参阅以下代码段。

参考网址：https://jqueryui.com/autocomplete/

＆＃13;

＆＃13;

$(function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });

＆＃13;

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">

<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>

＆＃13;

＆＃13;

＆＃13;