Question

我有一个包含伪画布的网页（请参阅https://jsfiddle.net/memeladon/vff01jq6/）。当用户将光标悬停在它们上方时，圆圈会随机改变颜色（鼠标悬停事件）。如何修改程序，以便仅在单击鼠标左键并且光标位于圆圈上时才更改颜色（单击+鼠标悬停事件）？目前我创建了具有这样功能的单元格：

function createCell() {
    var new_cell = document.createElement("DIV"),
        cell_circle = document.createElement("DIV");
    new_cell.classList.add("paint-cell");
    cell_circle.classList.add("paint-cell__circle");
    new_cell.appendChild(cell_circle);
    new_cell.addEventListener("mouseover",  function () { changeColor(cell_circle); });
    return new_cell;
}

Answer 1

您可以在回调函数中使用鼠标事件对象，并查看是否单击了鼠标按钮

new_cell.addEventListener("mouseover",  function (e) { 
   if(e.buttons !== 0)
   {
     //do cool stuff
   }
});

在纯JavaScript中组合DOM事件

1 个答案: