用Jquery检测矩形坐标中的点击

我希望我的代码在用户在矩形坐标内单击时检测并触发自定义函数

如果矩形的坐标已经知道

我试过这个密码

W = $(el).width();
   H = $(el).height();
   X = $(el).position().left;
   Y = $(el).position().top;

但无法检测到它

范例

想想这个。 我想在这些坐标内检测并触发函数

$(document).mousedown(function(e) {
   var x = e.pageX;
   var y = e.pageY; 

    if((x >= X && x <= X+W) &&
       (y >= Y && y <= Y+H))
        alert("in");
});

var el = "#div1";
var W = $(el).width();
var H = $(el).height();
var X = $(el).position().left;
var Y = $(el).position().top; 

获取鼠标坐标很容易：-

$('canvas').mousemove(function(e){
    drawPaddle(e.pageX, e.pageY);
});


function drawPaddle(paddleX, paddleY) {
    c.beginPath();
    c.rect(paddleX, paddleY, 150, 10);
    c.closePath();
    c.fill();
}

如何检测用户是否在我的矩形坐标内单击？

类似的内容

var mouseX;
var mouseY;


$(el).mousemove(function(e){
    mouseX = e.pageX;
    mouseY = e.pageY;
});

$(el).click(function(e)
{
    W = $(el).width();
    H = $(el).height();
    X = $(el).position().left;
    Y = $(el).position().top;

    if (mouseX>X   && 
        mouseY>Y   && 
        mouseX<X+W && 
        mouseY<Y+H)
    {
        //do something
    }
});

var-mouseX；
var mouseY；
$（el）.mousemove（函数（e）{
mouseX=e.pageX；
mouseY=e.pageY；
});
$（el）。单击（功能（e）
{
W=$（el）.width（）；
H=$（el）.高度（）；
X=$（el）.position（）.左；
Y=$（el）.position（）.top；
如果（mouseX>X&&
鼠标>Y&&
mouseX您可以直接在单击事件上检查鼠标位置。只需将其与矩形坐标进行比较即可

$(document).mousedown(function(e) {
   var x = e.pageX;
   var y = e.pageY; 

    if((x >= X && x <= X+W) &&
       (y >= Y && y <= Y+H))
        alert("in");
});

var el = "#div1";
var W = $(el).width();
var H = $(el).height();
var X = $(el).position().left;
var Y = $(el).position().top; 

$（文档）.mousedown（函数（e）{
var x=e.pageX；
var y=e.pageY；
如果（（x>=x&&x=Y&&Y
jQuery（'image'）。单击（函数（）{//do something}）
@Alp，我不想在点击图像时触发功能。我需要使用图像坐标来实现类似功能。我不明白你想用这些坐标做什么。请用更多信息更新你的问题。你也需要获取鼠标坐标，然后点击后检查鼠标是否在矩形内。刚刚编辑了我的问题按要求。问题是，我不知道如何比较两者。这我已经知道了。