如何在HTML画布中获得正确的鼠标坐标

canvas.addEventListener('mousemove', function(event) {
  // 在这里处理鼠标移动事件
});

canvas.addEventListener('mousemove', function(event) {
  var rect = canvas.getBoundingClientRect();
  var mouseX = event.clientX - rect.left;
  var mouseY = event.clientY - rect.top;
  // 在这里处理鼠标移动事件
});

canvas.addEventListener('mousemove', function(event) {
  var rect = canvas.getBoundingClientRect();
  var scaleX = canvas.width / rect.width;
  var scaleY = canvas.height / rect.height;
  var mouseX = (event.clientX - rect.left) * scaleX;
  var mouseY = (event.clientY - rect.top) * scaleY;
  // 在这里处理鼠标移动事件
});

canvas.addEventListener('mousemove', function(event) {
  var rect = canvas.getBoundingClientRect();
  var scaleX = canvas.width / rect.width;
  var scaleY = canvas.height / rect.height;
  var mouseX = (event.clientX - rect.left) * scaleX;
  var mouseY = (event.clientY - rect.top) * scaleY;
  
  if (mouseX >= 0 && mouseX < canvas.width && mouseY >= 0 && mouseY < canvas.height) {
    // 在这里处理鼠标移动事件
  }
});