Question

您好，我正在创建此脚本，在该脚本中创建一个发布请求，该请求将商品添加到购物车并在后端选择所有尺寸。

运行时，它会打开一个加载的html，我希望将要添加的当前项目的信息添加到html页面的表中。

我不确定这是否是最有效，最快捷的方法（请告诉我是否有更好的方法），但是我所做的是我在html / js页面上创建了一个侦听器并从后台发送消息。正在执行侦听消息的js页面的js页面。

它的作用是找到商品，然后发送商品名称消息，然后找到商品的正确颜色，并发送所选颜色的信息，然后找到尺寸并选择合适的尺寸。这是代码：

chrome.runtime.sendMessage({ carting: true, status: {
    status_item: (item[0]) //item name
} });

//carting code(irrelevant to this issue)

chrome.runtime.sendMessage({ carting: true, status: {
    status_color: (item[1]) //item color
} });

//more irrelevent carting code

chrome.runtime.sendMessage({ carting: true, status: {
    status_size: (size_text.text) // size
} });

这是我在侦听器页面中所拥有的：

chrome.runtime.onMessage.addListener(function(message, sender) {
    if (!message.carting) return;

    var Status = message.status;

    $(function() {

        $("#tasks_table").append('<tr>'
            +'<td>'+item+'</td>'
            +'<td>'+color+'</td>'
            +'<td>'+size+'</td>'
            +'</tr>'); 



    }
})

问题在于，在购物过程中仍未找到颜色时，它将不断在表中添加未定义的颜色，因此我通过使用函数找到了解决该问题的方法：

function waitForItem(item) {
    if (typeof item !== "undefined") {
         $("#tasks_table").append('<tr>'+'<td>'+item+'</td>');
        } else {
            setTimeout(waitForItem, 10);
        }
    }

function waitForColor(color) {
    if (typeof color !== "undefined") {
        $("#tasks_table").append('<td>'+color+'</td>');
        } else {
            setTimeout(waitForColor, 10);
        }
}

function waitForSize(size) {
    if (typeof size !== "undefined") {
        $("#tasks_table").append('<td>'+size+'</td>'+'</tr>');
        } else {
            setTimeout(waitForSize, 10);
        }
}
waitForItem(item);
waitForColor(color);
waitForSize(size);

现在它确实起作用了，它停止了将未定义的内容添加到表中，但是现在的问题是，它运行第一个项目函数，直到它完全完成为止，然后对每个函数进行依此类推。

当我有两个项目时，它将第一个项目的项目名称添加到表中，然后等待，直到找到第二个项目名称，并将其也添加，然后继续添加所有颜色和尺寸。问题是我的背景页面循环工作。它找到第一个项目，然后是它的颜色，然后是它的大小，然后转到下一个项目，它的颜色和它的大小。

因此，当它找到第一个项目然后找到第二个项目时，它将同时添加所有其余的颜色和大小。我不要。

我希望它以与后台页面运行相同的方式将信息添加到表中，以便用户可以看到运行的平稳和快速。

不要等到函数完成运行另一个函数

0 个答案: