点击跟踪器上的颜色更改

Question

我在第一次点击时添加了一种颜色，并在第二次点击时禁用了颜色。我希望能够做的是当颜色已经改变时我希望能够改变颜色并添加颜色，就好像它是第一次点击一样。例如，我已经点击了一个单元格，现在有了黑色。我希望能够立即将颜色从黑色更改为红色，同时保持我的功能是点击两次以删除颜色。这是我的项目：

https://codepen.io/frederickalcantara/pen/XVqZep

let color = 1;
    cell.addEventListener('click', () => {
        if (color) {
            cell.style.backgroundColor = colorPicker.value;
            color = 0;
        } else {
            cell.style.backgroundColor = "";
            color = 1;
        }
    });

Answer 1

您可以检查颜色是否与colorPicker值匹配

if (cell.dataset.color !== colorPicker.value) {
    cell.style.backgroundColor = colorPicker.value;
    cell.dataset.color = colorPicker.value;
} else {
    cell.style.backgroundColor = "";
    cell.dataset.color = ""
}

https://codepen.io/anon/pen/EoLELd?editors=0010

我在这里设置数据集颜色的原因是因为backgroundColor将hexircimal从colorPicker值转换为RGB，因此两者之间的检查不会起作用。