Question

我想在用户点击它时更改小部件的标签，然后我写代码如下：

var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
    id: "patchouliStatus",
    label: "Wait Page Loading...",
    contentURL: "http://www.mozilla.org/favicon.ico",
    onClick: function(){
        this.contentURL = "http://www.google.com/favicon.ico";
        this.label = "Clicked";
    }
});

当我点击小部件时，图标已经改变，但标签没有任何变化。我将鼠标移动到小部件，它仍然显示“等待页面加载......”。有没有办法动态更改标签？

Firefox：v27.0.1

附加SDK：v1.15

Answer 1

Widget的标签是只读的。您必须使用tooltip属性向用户显示鼠标悬停时的文本，这样：

var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
    id: "patchouliStatus",
    label: "Wait Page Loading...",
    contentURL: "http://www.mozilla.org/favicon.ico",
    onClick: function(){
        this.contentURL = "http://www.google.com/favicon.ico";
        this.tooltip = "Clicked";
    }
});

作为docs says somewhere in this section - 我认为可以更清楚地记录 - 工具提示值是“当用户的鼠标悬停在小部件上时显示的可选文本。如果没有给出，则使用标签”。此外，该部分的例子并没有像我认为的那样清楚。

Answer 2

好的男士感谢XPI，将changeLabel功能更改为此，我的上述内容确实存在错误。

function changeLabel(str){
    var DOMWindows = Services.wm.getEnumerator('navigator:browser');
    while (DOMWindows.hasMoreElements()) {
        var aDOMWindow = DOMWindows.getNext();
        var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g@jetpack-patchouliStatus');
        if (myWidget) {
            Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
            myWidget.setAttribute('label', str);
            myWidget.setAttribute('tooltiptext', 'tooltip changed');
        } else {
            Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
        }
    }
}

您的小部件的ID似乎也以tyour插件ID名称开头。

现在我给了你枚举器函数，因为它遍及所有窗口，你可以添加事件监听器。但实际上，如果您只是想要定位被点击的那个，只需获取最新的窗口，因为我们只需点击那里就会显示您的小部件的正确窗口，并且事件监听器会在点击时触发。

将changeLabel更改为：

function changeLabel(str){
    var aDOMWindow = Services.wm.getMostRecentWindow('navigator:browser');
    var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g@jetpack-patchouliStatus');
    if (myWidget) {
        Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
        myWidget.setAttribute('label', str);
        myWidget.setAttribute('tooltiptext', 'tooltip changed');
    } else {
        Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
    }
}

另外，Services.appShell.hiddenDOMWindow.console.info只是调试的好东西，我把它留在那里，这样你就可以看到它是如何工作的。它会记录到“浏览器控制台”（Ctrl + Shift + J）。

作为最后一点，我通过要求使用chrome来使用非sdk解决方案。他们建议你不要这样做，因为他们希望你使用我不了解SDK的SDK函数，但你可以使用getEnumerator和recentWindow函数，要求window/utils看起来像：

阅读window/utils article here

Answer 3

我会在这里给你非sdk解决方案，但有人必须帮助将其转换为sdk解决方案。你可以将它粘贴在它可以使用的代码中。

我不确定该元素是如何插入dom的，但我猜到了。

var {Cu, Ci} = require('chrome'); //if you want to paste this into scratchpad with with Environemnt set to Browser than dont need this line, this line is for sdk
var DOMWindows = Services.wm.getWindowEnumerator(null);
while (DOMWindows.hasMoreElements()) {
var aDOMWindow = aXULWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowInternal || Ci.nsIDOMWindow);
  var myWidget = aDOMWindow.querySelector('#patchouliStatus'); //im not exactly sure how the element is inserted in the dom but im guessing here
  if (myWidget) {
    myWidget.label = 'rawr';
  }
}

如何更改窗口小部件的标签（Firefox附加SDK）

3 个答案: