0

我正在使用context-menu项目单击来显示一个对话框（使用 JQuery/Bootstrap），该对话框允许用户通过 AJAX 将他们选择的文本提交到 Web 服务（这一切都很好）。提交后，我打算显示一个附加 SDKnotification来表示“感谢您的提交”。

现在，我知道我需要从内容脚本向附加脚本发送一条消息以显示通知，但是从回调函数发送时我的消息没有到达。

我的附加代码（摘录）：

var pageMod = require("page-mod");
pageMod.PageMod({
  include: ['*'],
  contentScriptWhen: "end",
  contentScriptFile: [ data.url("js/content.js") ],

  onAttach: function onAttach( worker, mod) {
    worker.port.on("submittedNotif", function(msg) {
        console.log('Hello');
        notifications.notify({ ... });
    })
  }
});

内容脚本如下。我已经指出了消息到达和没有到达的情况。

// Handle the context-menu Item's click and show the dialog

self.on("click", function(node,data) {
    self.port.emit("submittedNotif", '*** DOES NOT ARRIVE ***');
    showDialog( 'DialogName', function (response) { /* Do stuff */ });
})

self.port.emit("submittedNotif", '*** Arrives OK ***');

function showDialog( str, response) {
    // Dialog stuff
    self.port.emit("submittedNotif", '*** DOES NOT ARRIVE ***');
}

我被告知self是一个全局对象，所以我当然不必将它作为参数传递。我只是不清楚如何尝试发送 viaself.port.emit应该根据它在内容脚本中的使用位置而有所不同。例如，我不知道有任何线程问题。也许这是我的 JavaScript 知识的一个空白，但谁能告诉我我做错了什么？

4

2 回答 2

1

我不清楚点击事件来自哪里

self.on('click')

相反，您需要做的是将单击处理程序绑定到页面 DOM 中将被单击的某些内容，例如您提到的对话框。查看这个相当简单的构建器示例，它通过在显示确认对话框时发出事件来完成此操作：

https://builder.addons.mozilla.org/addon/1049875/latest/

主.js：

var data = require("self").data;
var notifications = require("notifications");
var pageMod = require("page-mod");
pageMod.PageMod({
  include: ['*'],
  contentScriptWhen: "end",
  contentScriptFile: [ data.url("jquery.js"), data.url("content.js") ],

  onAttach: function onAttach( worker, mod) {
    worker.port.on("submittedNotif", function(msg) {
        notifications.notify({
            title: 'Notification!',
            text: 'This is the notification: '+ msg
        });
    })
  }
});

内容.js：

$(function() {
    if(confirm("send submitted event?")) {
        self.port.emit("submittedNotif", '*** DOES NOT ARRIVE ***');
        showDialog( 'DialogName', function (response) { /* Do stuff */ });
    }
});


//self.port.emit("submittedNotif", '*** Arrives OK ***');

function showDialog( str, response) {
    // Dialog stuff
    self.port.emit("submittedNotif", '*** DOES NOT ARRIVE ***');
}
于 2012-04-22T22:30:11.320 回答
0

我解决了我自己的问题。这是我学到的方法和方法。

首先，内容脚本和context-menu项目的点击处理程序：

self.on("click", function(node,data) {
    self.postMessage({ kind:'submittedNotif', msg: 'Just clicked'})
    showDialog( self, 'DialogName', function (response) { /* Do stuff */ });
})

现在，旧的self.port.emit让我无处可去，但切换到self.postMessage并添加onMessage()到context-menu项目最终给了我想要的事件。

我现在也传递self给showDialog()方法 [这违背了我被告知self的全局......？！]，作为参数'eventHandler'：

function showDialog( eventHandler, str, response) {
    // Dialog stuff
    eventHandler.postMessage({ kind:'submittedNotif', msg: 'Thank you for your submission'});
}

再次，我放弃self.port.emit，切换到self.postMessage，并在传入的处理程序上调用它。

最后，notifications.notify({ ... });调用从PageMod's移动onAttach()到菜单 Item's onMessage()。简而言之，响应该点击而发生的一切现在都发生在菜单项的范围内。

现在一切正常。回想起来，这一切似乎都是显而易见的——但文档肯定是混淆而不是澄清，尤其是port和postMessage()

于 2012-04-24T20:30:11.027 回答