javascript - 寻找一种方法在spectrumjs中具有相同类名的两个不同按钮上触发单独的事件

Question

我正在使用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 按钮​​时，我丢失了原始背景颜色，因为这两个都被调用。最初更改颜色，然后更改背景颜色或文本颜色正确更改后，不会发生这种情况。主要是在第一次更改文本颜色之后，我失去了背景。

Answer 1

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

$(".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();
});