0

这是我的 main.js：

var data = require("self").data;
var window = require("window-utils").activeBrowserWindow;
var tabs = require("tabs");
var Request = require("request").Request;

var team = require("page-mod").PageMod({
include: ["http://www.example.com/team/*"],
contentScriptFile: [data.url("jquery.js"), data.url("item.js")],
contentScriptWhen: 'ready',
onAttach: function(worker) {

        worker.port.on('got-id', function(id) {
        var requesturl = "http://www.othersite.com/item/" + id;   

        Request({
            url: requesturl,
            onComplete: function(response) {
                worker.port.emit('got-request', response.text);
            }
        }).get();

    });
}
});

和我的 item.js：

// Getting number of total items in the page
var totalitems = document.getElementById("NumberOfItems").textContent;
totalitems = parseInt(totalitems);
// Creating array for items position
positions = [];
for ( z = 0; z <= totalplayers-1 ; z++ ) { positions.push(z < 10 ? ("0" + z.toString()) : z.toString()); }
$.each( positions, function(players, position) {
// Getting item id for the request
var player_id = $("#item-position" + position).attr("href").match(RegExp('items/([^/]+)/details.aspx$'))[1];
self.port.emit('got-player-id-team', player_id);

self.port.on('got-request-team', function(data) {
var columns = $('div.columns',data);
replacediv = $("div#itembox").eq(position).find('td').eq(3);
replacediv.append(columns);
});
});

它似乎工作正常，但所有 div 都被每个项目附加！我如何修改它以将每个项目的获取数据仅放置在该项目中而不是每个项目中？

我做错了什么？我认为它运行了两次！它就像runs = totalitems*2。

如果我强制它只运行第一项，一切都很好！

对不起，我的英语不好！我知道这很难理解，所以我正在等待您的评论

4

1 回答 1

0

据我所知，您的代码中的问题在这里：

$.each( positions, function(players, position) {
    // ...
    self.port.on('got-request-team', function(data) {
        var columns = $('div.columns',data);
        replacediv = $("div#itembox").eq(position).find('td').eq(3);
        replacediv.append(columns);
    });
});

基本上对于循环的每个循环，您都在为“got-request-team”事件添加一个新的侦听器。假设您在 中只有一项positions：那么，您与此事件关联的只有一个函数，并且当您发出“got-request-team”时，仅执行该函数。但是，如果你在positions数组中有 20 个项目，你会将 20 个不同的函数关联到同一个事件，所以当发出 'got-request-team' 时，它们都会被执行。

另外，因为您创建了一个闭包，所以position事件侦听器中的变量将始终设置最后一个值，我相信这不是您的意图。这是一个常见错误，您可以在此处找到更多详细信息，例如：在循环中绑定事件处理程序需要闭包？

还有一些其他的小事情（例如，我在replacediv任何地方都没有看到声明），但它们与您的问题无关。

希望能帮助到你！

更新：关于你的评论，如果没有测试代码很难回答，但我相信你的错误仍然在上面的部分：首先，不仅仅是positions，position你必须“绑定”。因为你在内容脚本中，你可以使用let，因此你可以尝试这样的事情：

$.each(positions, function(players, position) {
    // ...

    let pos = position; // let is block scope
    self.port.on('got-request-team', function(data) {
        var columns = $('div.columns',data);
        replacediv = $("div#itembox").eq(pos).find('td').eq(3); // use pos here
        replacediv.append(columns);
    });
});

请注意，在这里您仍然存在为每个项目positions（您说您已修复）添加新侦听器到同一事件的问题，我只是重用此代码来显示let在此上下文中的用法。

于 2012-12-12T03:13:54.410 回答