javascript - 单击某个对象时获取该对象的位置

Question

我当前的jFiddle:http://jsfiddle.net/3HauW/85/

当您在页面上移动 bean 1(框 1)时，它会显示它的位置，但如何显示第二个框的位置？我希望它能够显示我点击的任何内容的位置。

因此，如果我单击框 1 并移动它，它将显示第一个框的 X 和 Y

如果我舔了盒子 2 并移动了它，它应该显示第二个盒子的 X,Y。

这是显示 X 和 Y 位置的代码部分:

   $( "*", document ).on('click',function( event ) {
            var offset = $( "strong" ).offset();
            topp = offset.top;
            left = offset.left;
            event.stopPropagation();
            $( "#result" ).text( this.tagName +
            "  ( " + left + ", " + topp + " )" + offset.id );


}

另外，为什么 id 未定义？

Answer 1

draggable 有一个内置的停止事件

所以使用它可能是有意义的。

类似这样的东西:

$('.normal, .failure').draggable({//drag
    stop: function() {//on stop
        var t = parseInt($(this).position().top),//get top
            l = parseInt($(this).position().left);//get left
        $( "#result" ).text( this.tagName+' ('+l+', '+t+') '+this.id);//print
    }
});

做了一个 fiddle : http://jsfiddle.net/filever10/8MVT9/

并且 ID 未定义，因为 $( "strong").offset().id 不正确，它需要是 $ ( "strong").prop('id') 或类似的东西。虽然 strong 没有 ID，所以它仍然无法工作...您需要 .normal 的 ID & .failure 让它做你想做的事。