在Chrome扩展程序上设置自动完成功能的背景颜色

时间:2020-05-29 05:18:42

标签: javascript jquery google-chrome-extension

我已经创建了一个chrome扩展程序来自动填写表格。

我用来自动完成的代码基本上是this site中的一次

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

它可以完成工作,但是由于背景是透明的,因此我无法阅读建议,如下图所示:

enter image description here

是否可以通过扩展名设置纯白色背景颜色?

编辑:

我正在尝试按照建议进行更改。这会改变工作:

document.querySelector("[id='tags']").style.color="Red"
document.querySelector("[id='tags']").style.backgroundColor="Red"

但这只会更改文本框:

enter image description here

我只想更改选项的背景。

我尝试了这个:

document.querySelector("[id='tags']").background-color =  "Red"

并出现以下错误:

Uncaught SyntaxError: Invalid left-hand side in assignment

1 个答案:

答案 0 :(得分:1)

您引用的网站在显示自动完成功能时会添加<ul>。您需要为ul添加一个css才能拥有一个background-color。因此以下代码对我有用。

  ul#ui-id-1 {
   background-color: red;
  }