新手在Firefox扩展（XUL）的Javascript中停留在基本事件侦听器上

Question

I've been working through the MDN tutorials, but I haven't been able to get JS event listeners to work yet. I'm up to the last bit of this page: https://developer.mozilla.org/en-US/docs/XUL/Tutorial/Adding_Event_Handlers

In XUL I have a menuitem: menuitem id="appmenu-libraryHistory" label="History"/>

And in JS I have this: var HistoryWatch = document.getElementById("appmenu-libraryHistory"); HistoryWatch.addEventListener('command', showLibrary, "History"); function showLibrary(aLeftPane) { ... }

I thought this would pass the string "History" to the function showLibrary when the menu entry "History" was pressed. The showLibrary function does work if I pass parameters directly from the XUL, but if I do that it won't let me pass a URI which is what I'll want to do eventually.

Answer 1

I suspect the JavaScript you have shown is in a file that is included as part of a <script> tag. It may not work because by the time the document.getElementById() line runs, the page hasn't been constructed yet, and there is no element with this id yet.

You need to wait for the page to fully load to be sure that your menu exists. If you are working on a separate window you can call an initialization function from its onload attribute in xul. If you are overlaying just a menu in an existing window, you will need to listen to the load event of the parent window and call your initialization from there :

function init()
{
  window.removeEventListener("load", init, false); // Remove the handler as we don't need it anymore.

  var historyWatch = document.getElementById("appmenu-libraryHistory");
  historyWatch.addEventListener('command', showLibrary, "History");
}

window.addEventListener("load", init, false);

Note that in this example, init (and showLibrary ) are polluting the global namespace, it would be better to encapsulate them in an object.

Also note that the order matters because when the last line runs, the init function must have been declared already, otherwise it will attach nothing ( undefined ).