JSFiddle - React, Tailwind, and code Playground

HTML

<div id="canvas" style="position:relative;width:600px;height:300px; border: 1px solid red;" onclick="q()"></div>

JavaScript

function q(event) {
    event = event || window.event;
    
    var canvas = document.getElementById('canvas'),
        x = event.pageX - canvas.offsetLeft,
        y = event.pageY - canvas.offsetTop;
    
    alert(x + ' ' + y);
}