3

我正在编写我的第一个 Firefox XUL 工具栏，并且出现了一个奇怪的行为 - 为了调试我的代码，我从 Firefox 工具栏和我创建的一个非常简单的 HTML 文件上的按钮调用了相同的 js 函数。

javascript 函数显示一个警报窗口，使用“document.getElementById”获取一个元素，更改其颜色，然后显示另一个警报窗口。

javascript 函数在使用 HTML 按钮调用时运行良好，但在使用工具栏按钮时，'document.getElementById' 返回 null 并且函数终止（仅显示第一个警报窗口）。

任何猜测可能是错的？我在下面提供（非常简单的）代码以供参考。

提前谢谢了！

javascript 文件 - facebrew.js

function FaceBrew_rtlSelection() {
    alert('Before!'); 
  sel_node = document.getElementById("header");
    sel_node.style.color = 'blue';
    alert('After!'); 
}

HTML 文件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Test</title>
    <script type="text/javascript" src="http://localhost/Sandbox/FaceBrew/chrome/content/facebrew.js"> </script>
</head>

<body>
<input type="button" value="Click me" id="select" onclick="FaceBrew_rtlSelection()" />
<div id="header">
  <h1>Hello world!< /h1>
</div>
</body>
</html>

XUL 文件 - facebrew.xul

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://facebrew/skin/facebrew.css" type="text/css"?>

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

    <script type="application/x-javascript"
            src="chrome://facebrew/content/facebrew.js" />
         
    <toolbox id="navigator-toolbox">
        <toolbar id="FaceBrew-Toolbar" toolbarname="FaceBrew Toolbar" accesskey="F"
                 class="chromeclass-toolbar" context="toolbar-context-menu" 
                 hidden="false" persist="hidden">
            <toolbaritem flex="0">            
                <toolbarbutton id="FaceBrew-Web-Button" tooltiptext=""
                               label="Run" oncommand="FaceBrew_rtlSelection()" />
            </toolbaritem>
        </toolbar>
    </toolbox>
</overlay>

CSS 文件 - facbrew.css

#FaceBrew-Web-Button {
    list-style-image: url("chrome://facebrew/skin/web.png");
}
4

2 回答 2

3

正如保罗所说，当从工具栏调用函数时，文档上下文是不同的。获取您当前选择的 HTML 文档对象：

var doc = gBrowser.selectedBrowser.contentDocument;
doc.getElementById(...);

此外，您始终可以查看错误控制台以了解您的代码失败的原因（工具 -> 错误控制台）。

于 2010-01-24T17:52:06.040 回答
1

您的工具栏是一个叠加层，因此上下文（文档和窗口）是 browser.xul，而不是您的 html 文件。

于 2010-01-23T21:50:38.917 回答