javascript - Bagaimana untuk merealisasikan jarak antara bahagian dalam DIV dan tetikus dalam JS

Question

Ini adalah masalah yang tidak dapat saya selesaikan walaupun saya merobek otak saya↓

Bahagian hadapan! Seperti yang ditunjukkan dalam rajah, bagaimana untuk mendapatkan jarak koordinat dari bahagian paling kiri p ke kedudukan tetikus?

Answer 1

    body{
        margin:0;
        padding:0;
    }
    #p{
        width:200px;
        height:100px;
        border:1px solid #000;
        position:absolute;
    }
    //如果p有定位父级元素存在还需要减去offsetTop值
    $("#p").bind("click",function(ev){
        console.log(ev.clientX - $(this).offset().left);
    })

Answer 2

$("p").on("click",function(e){
    var disX = e.clientX - e.offsetX;    //disX就是当前p最左侧到鼠标位置的坐标距离
});