自动完成js - 列表的滚动条的列表向下箭头闪烁

Posted 2023-05-08

【中文标题】自动完成js - 列表的滚动条的列表向下箭头闪烁

【英文标题】：Autocomplete js - The list's scrollbar's list down arrow flickers

【发布时间】：2021-02-05 01:41:24

【问题描述】：

我有一个自动完成列表，并且列表的滚动条的向下箭头正在将焦点设置到第一个元素，它会闪烁。用鼠标滚动时工作正常。 使用 jquery 3.4.1。

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

问题只是自动完成列表滚动条中的底部箭头：

【问题讨论】：

请向我们展示您的代码

@IvanD 添加了代码

【参考方案1】：

我不确定您是否共享了完整的代码，可能是您项目的其他地方有问题。以下代码工作正常：

$(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
  );
);

.ui-autocomplete 
  position: absolute;
  top: 0;
  left: 0;
  cursor: default;
  height: 100px;
  overflow-y: auto;
  overflow-x: hidden;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

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