Javascript 正在寻找在spectrumjs中使用相同类名的两个不同按钮上触发单独事件的方法

我使用的是spectrumjs，当单击一个按钮时，它会调用两个按钮的代码。如果我可以更改其中一个按钮的类名，问题就会解决，但是颜色选择器是动态生成的，我不知道如何重新配置代码来实现这一点

以下是我所拥有的：

$(".sp-choose").click(function(){
    bgColor = $("#custom").spectrum("get");
    bgColor = bgColor.toHexString();
    canvas.backgroundColor = bgColor;
    canvas.setBackgroundImage();
    canvas.renderAll();
});

$(".sp-choose").click(function() {
    newColor = $("#custom2").spectrum("get");
    newColor = newColor.toHexString();
    canvas.freeDrawingBrush.color = newColor;
    drawColor();
    canvas.renderAll();
});

---

当我更改文本的颜色并单击sp choose按钮时，我会丢失原始背景色，因为这两种颜色都被调用。在最初更改颜色，然后更改背景色或文本颜色后，不会发生这种情况。大多数情况下，在第一次更改文本颜色后，我会丢失背景。

如果只有两个按钮，并且您不需要漂亮的解决方案，您可以通过索引将这两个按钮分开：

$(".sp-choose").eq(0).click(function(){
    bgColor = $("#custom").spectrum("get");
    bgColor = bgColor.toHexString();
    canvas.backgroundColor = bgColor;
    canvas.setBackgroundImage();
    canvas.renderAll();
});

$(".sp-choose").eq(1).click(function() {
    newColor = $("#custom2").spectrum("get");
    newColor = newColor.toHexString();
    canvas.freeDrawingBrush.color = newColor;
    drawColor();
    canvas.renderAll();
});

---

如果只有两个按钮

$(".sp-choose").click(function (e) {
    if (this == $(".sp-choose")[0]) {
        bgColor = $("#custom").spectrum("get");
        bgColor = bgColor.toHexString();
        canvas.backgroundColor = bgColor;
        canvas.setBackgroundImage();
        canvas.renderAll();
    }
});

$(".sp-choose").click(function (e) {
    if (this == $(".sp-choose")[1]) {
        newColor = $("#custom2").spectrum("get");
        newColor = newColor.toHexString();
        canvas.freeDrawingBrush.color = newColor;
        drawColor();
        canvas.renderAll();
    }
});

或类似的，将工作。第一个按钮将运行第一个功能，第二个按钮将运行第二个功能。您可以将两者合并为一个函数，并在其中切换

$(".sp-choose").click(function (e) {
    if (this == $(".sp-choose")[0]) {
        bgColor = $("#custom").spectrum("get");
        bgColor = bgColor.toHexString();
        canvas.backgroundColor = bgColor;
        canvas.setBackgroundImage();
        canvas.renderAll();
    }

    if (this == $(".sp-choose")[1]) {
        newColor = $("#custom2").spectrum("get");
        newColor = newColor.toHexString();
        canvas.freeDrawingBrush.color = newColor;
        drawColor();
        canvas.renderAll();
    }
});

像这样

---

将事件附加一次并在两个案例中处理您的逻辑这与“fabricjs”有关吗？