使用jQuery如何获取目标元素上的点击坐标

  • Z时代
  • 2024-01-10
  • 分类：问答

我的html元素具有以下事件处理程序

jQuery("#seek-bar").click(function(e){
    var x = e.pageX - e.target.offsetLeft;
    alert(x);    
});

单击时，我需要在＃seek-bar上找到鼠标的位置。我以为上面的代码应该可以工作，但是结果不正确

回答：

您是否要relative简单地将鼠标指针定位到元素（或）的位置，

回答：

1）event.pageX，event.pageY给你鼠标位置的相关文件！

2）offset()：给出元素的偏移位置

3）position()：它为您提供元素的相对位置，即

考虑一个元素嵌入另一个元素内

：

<div id="imParent">
   <div id="imchild" />
</div>

<body>
   <div id="A" style="left:100px;"> Default    <br /> mouse<br/>position </div>
   <div id="B" style="left:300px;"> offset()   <br /> mouse<br/>position </div>
   <div id="C" style="left:500px;"> position() <br /> mouse<br/>position </div>
</body>

$(document).ready(function (e) {
    $('#A').click(function (e) { //Default mouse Position 
        alert(e.pageX + ' , ' + e.pageY);
    });
    $('#B').click(function (e) { //Offset mouse Position
        var posX = $(this).offset().left,
            posY = $(this).offset().top;
        alert((e.pageX - posX) + ' , ' + (e.pageY - posY));
    });
    $('#C').click(function (e) { //Relative ( to its parent) mouse position 
        var posX = $(this).position().left,
            posY = $(this).position().top;
        alert((e.pageX - posX) + ' , ' + (e.pageY - posY));
    });
});

以上是 使用jQuery如何获取目标元素上的点击坐标 的全部内容， 来源链接： utcz.com/qa/418392.html

回到顶部