如何使用 Firefox SDK（用于插件）检测通过双击选择的文本？

Question

用户将双击网页中的一个词，插件应该能够监听该事件并获取所选文本。

What the SDK page for selection gives as an example:

get_definitions.port.on("text-entered", function (text) {
  console.log(text);
  text_entry.hide();
});

function myListener() {
  console.log(selection.text);
}

问题是检测到任何类型的选择。我需要的是通过双击选择文本时检测文本...

我不知道如何添加一个事件监听器来监听网页上的双击事件。请注意：

addEventListener('dblclick', function);

不起作用，因为插件的 index.js 无法直接与网页交互。所以它必须一直监听通过 firefox SDK 提供的 "double click" 事件，但是如何做呢？

Answer 1

所以插件必须在 window:

中获取选定的文本

插件无法直接操作 window 或选项卡。我的意思是它可以获取有关它的详细信息——比如所有活动选项卡的列表、打开一个选项卡、获得焦点等。

附上内容脚本

但要真正在较低级别上工作，因为 "getting the selected text" Firefox SDK 提供了“Content Scripts”。它们必须附加到目标选项卡。我们可以通过两种方式附加内容脚本 "someScript.js"：

您可以使用 tabs API 直接附加：

var tabs = require("sdk/tabs");

tabs.on('activate', function(tab) {
  var worker = tab.attach({
    contentScriptFile: data.url("someScript.js")
  });
});

或者你可以使用 PageMod :

var pageMod = require("sdk/page-mod");

pageMod.PageMod({
  include: "*.mozilla.org",
  contentScriptFile: data.url("someScript.js")
});

Tabs API 和 PageMod API:

确实有区别

标签 API ：您可以根据不同的标准（哪个标签，哪个状态等）决定将 contentScript 附加到哪个标签。

PageMod API : 附加到具有匹配 URL 模式的所有页面。

现在附加的 contentScript 就像它附加到的页面的一部分一样。

用someScript.js做事：

本例中通过双击获取选中的文本：

//someScript.js
document.addEventListener('dblclick', function(){
        var selObj = window.getSelection();
        oRange = selObj.getRangeAt(0);
        var selectedText = selObj.toString();

        console.log(selectedText);
}, false);

contentScript 与 main.js（插件）之间的通信：

如您所见，contentScript 只是将选定的文本打印到控制台。要与插件或 main.js 或 index.js 进行相同的通信，我们需要 make use of the "port" object.

标签 API:

var tabs = require("sdk/tabs");

tabs.on('activate', function(tab) {
  var worker = tab.attach({
    contentScriptFile: data.url("someScript.js")
  });

  //Keep listening on the port named "selectedText" from someScript.js
  worker.port.on("selectedText", function(sText) {
      console.log(sText);
  });
});

PageMod API:

var pageMod = require("sdk/page-mod");

pageMod.PageMod({
  include: "*.mozilla.org",
  contentScriptFile: data.url("someScript.js"),

  //Keep listening on the port named "selectedText" from someScript.js
  onAttach: function(worker) {
      worker.port.on("selectedText", function(sText) {
          console.log(sText);
      });
  }
});

将消息从 contentScript 发送到 main.js:

//someScript.js
document.addEventListener('dblclick', function(){
        var selObj = window.getSelection();
        oRange = selObj.getRangeAt(0);
        var selectedText = selObj.toString();

        console.log(selectedText);

        //emit the selected text on port named "selectedText"
        self.port.emit("selectedText", selectedText);
}, false);

如何使用 Firefox SDK（用于插件）检测通过双击选择的文本？

How to detect text selected by double clicking using Firefox SDK (for addons)?

javascript

double-click

event-listener

firefox-addon

firefox-addon-sdk