如何在firefox插件中的脚本之间移动jQuery对象?

时间:2014-10-26 21:59:14

标签: jquery object firefox-addon

我在我的插件和脚本中有一个带脚本和jQuery的面板,它运行到页面中。 如何将对象从我的面板复制到页面?

main.js

var tabs = require("sdk/tabs");
var self = require("sdk/self");
var button = require("sdk/ui/button/action").ActionButton({
    id: "show-panel",
    label: "Show Panel",
    icon: {
        "16": "./icon-16.png",
        "32": "./icon-32.png",
        "64": "./icon-64.png"
    },
    onClick: handleClick
});
var panel = require("sdk/panel").Panel({
    contentURL: self.data.url("page.html"),
    contentScriptFile: [self.data.url("jquery-2.1.1.min.js"), self.data.url("panel-script.js")],
    position: button
});

function handleClick() {
    panel.show();
    var worker = tabs.activeTab.attach({
        contentScriptFile: [self.data.url("jquery-2.1.1.min.js"), self.data.url("page-script.js")]
    });
    panel.port.emit('to-panel');
    panel.port.on("from-panel", function(pic) {
        worker.port.emit("to-page", pic);
    });
}

panel.html

<html>
<head>
</head>
<body>
    <img src="icon-64.png" class="add-img" alt="">
    <button class="click">Click Me!</button>
</body>
</html>

panel.js

self.port.on("to-panel", function() {
    var pic = $('.add-img');
    $('button.click').on('click', function(){
        self.port.emit("from-panel", pic);
    });
});

page.js

self.port.on("to-page", function(pic) {
    $('body').append(pic);
});

我想从我的面板中复制元素并将其放到页面上。 我尝试将其设置为变量名为&#39; pic&#39;并传送到page.js放置在网页上,但它不起作用。然而,简单的字符串很容易传输并放在页面上。

浏览器控制台显示&#34; TypeError:a未定义&#34;。

请帮助并抱歉英语不好。

1 个答案:

答案 0 :(得分:0)

var myobjStr = JSON.stringify(myObj)面板中的对象。然后将其转换为字符串。所以现在将该字符串传递给您的页面,然后在您的粘贴中将其解析为:

var myobjFromStr = JSON.parse(myobjStr)