无法在 JavaScript 中捕获 XUL 面板元素

Question

我正在尝试通过 javascript 访问 XUL 面板元素以动态打开和关闭它。

<?xml version="1.0"?>

<?xml-stylesheet type="text/css" href="chrome://global/skin/" ?>
<?xml-stylesheet type="text/css"
  href="chrome://textareaautocomplete/skin/browserOverlay.css" ?>

<!DOCTYPE overlay SYSTEM
  "chrome://textareaautocomplete/locale/browserOverlay.dtd">

<overlay id="textareaautocomplete-browser-overlay"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <script type="application/x-javascript"
    src="chrome://textareaautocomplete/content/browserOverlay.js" />

<stringbundleset id="stringbundleset">
    <stringbundle id="textareaautocomplete-string-bundle"
      src="chrome://textareaautocomplete/locale/browserOverlay.properties" />
  </stringbundleset>

  <menupopup id="menu_ToolsPopup">
    <menu id="xs-textareaautocomplete-menu" label="&textareaautocomplete.menu.label;"
      accesskey="&textareaautocomplete.menu.accesskey;"
      insertafter="javascriptConsole,devToolsSeparator">
      <menupopup>
        <menuitem id="textareaautocomplete-ta-menu-item"
          label="&textareaautocomplete.cache.start.label;"
          accesskey="&textareaautocomplete.cache.accesskey;"
          oncommand="TextareaAutocomplete.BrowserOverlay.main();" />
      </menupopup>
    </menu>
  </menupopup>

  <panel id="textareaautocomplete-ta-dropdown-panel">
    <textbox id="search"/>
  </panel>

</overlay>

try {
  let panel = document.getElementById("textareaautocomplete-ta-dropdown-panel");
  panel.openPopup(node, "after_start", 0, 0, false, false);
}
  catch(e) {
  window.alert("Failed to set drop down: " + e.name + ": " + e.message);
}

这给了我以下异常错误消息：

panel is null

如果缺少或不正确，请告诉我！还有一点是，我只需在相同的 JavaScript 代码中更改 id 即可访问其他元素，例如 stringbundleset、menupopup。

Answer 1

将面板包裹在垂直盒子或水平盒子内
例如：在你的情况下

<hbox>
<panel id="textareaautocomplete-ta-dropdown-panel">
    <textbox id="search"/>
  </panel>
<hbox>