尝试在内容脚本中调用函数时，“函数未定义”

'Function is not defined' when trying to call a function inside a contentScript

本文关键字：函数 未定义 函数未定义 调用 脚本      更新时间：2023-09-26

插件代码，创建一个Panel。
onShow()，从本地文件系统读取文件列表并将其填充到Panel中。
单击文件名旁边的<img>时，我正在尝试调用Namespace.load()，以向我的插件代码发送消息，但是我得到了Namespace is not defined.

知道为什么吗？

Data.js 

var data = require("sdk/self").data;
exports.get = function(content) {
    return data.url(content);
};

main.js 

var Data = require("./Data");
var panel = Panel.Panel({
  width: 450,
  height: 300,
  contentURL: Data.get("html/view.html"),
  contentScriptFile: Data.get("js/controller.js"),
});

错误。。

JavaScript error: resource://jid1-xqhae0e9m07ekq-at-jetpack/addon-firefox/data/html/view.html, line 1: Namespace is not defined

controller.js （内容脚本） ..

var Namespace = {
  load: function(filename) {
    self.port.emit("load", filename);
  }
};
self.port.on("uiData", function (uiData) {
  var parsed = JSON.parse(uiData),
    content = '';
  for (var i = 0; i < parsed.files.length; i++) {
    content = '<tr>';
    content += '<td>' + parsed.files[i] + '</td>';
    content += '<td><img onclick="Namespace.load(' + parsed.files[i] + ');" src="../images/load-24.png"></img>';
    content += '</td></tr>';
    document.getElementById('resultFiles').innerHTML += content;
  }
  document.getElementById("directory").value = parsed.directory;
});

使用了Components.utils.exportFunction，因为FF30中内容脚本的执行环境发生了变化，如此处所述。

var Namespace = {
  load: function(filename) {
    self.port.emit("load", filename);
  }
};
exportFunction(Namespace.load, unsafeWindow, {defineAs: "load"});
self.port.on("uiData", function (uiData) {
  var parsed = JSON.parse(uiData),
    content = '';
  for (var i = 0; i < parsed.files.length; i++) {
    content = '<tr>';
    content += '<td>' + parsed.files[i] + '</td>';
    content += '<td><img onclick="window.load(''' + parsed.files[i] + ''');" src="../images/load-24.png"></img>';
    content += '</td></tr>';
    document.getElementById('resultFiles').innerHTML += content;
  }
  document.getElementById("directory").value = parsed.directory;
});

我认为工作代码如下所示：

var data = require("sdk/self").data;
var panel = Panel.Panel({
  width: 450,
  height: 300,
  contentURL: data.url("html/view.html"),
  contentScriptFile: data.url("js/controller.js"),
});

您可以通过 self.data.url（） 获取给定文件的资源 uris。有关详细信息，请参阅面板上的文档。

相关文章：