HTML元素的坐标 [英] Coordinates of HTML elements

问题描述

我将创建一个选择'套索'，用户可以使用它来选择表格的某些部分。我认为在区域上定位div要比操纵单元格边界容易得多。

如果您不明白我的意思，请打开电子表格并拖动一个区域。我希望div完全对齐单元格边界。

我对如何做到这一点有一个很好的想法，但我如何获得（x ，y）表格单元格（td）的坐标（屏幕位置）？

解决方案

使用 .offset（） 以及 .height（） 和 .width（） 。

  var td = $（someTDReference）; 
 var pos = td.offset（）; 
 pos.bottom = pos.top + td.height（）; 
 pos.right = pos.left + td.width（）; 
 // pos现在包含顶部，左侧，底部和右侧像素
  

编辑： .position（） ，使用 .offset（）。

编辑：已将 pos.width（）更改为 td.width（）

I am going to create a selection 'lasso' that the user can use to select portions of a table. I figured that positioning a div over the region is far easier than trying to manipulate the cell borders.

If you don't understand what I mean, open up a spread sheet and drag over a region. I want the div to align perfectly with the cell borders.

I have a very good idea of how to do this, but how would I get the (x,y) coordinates (screen position) of a table cell (td)?

解决方案

Use .offset() along with .height() and .width() if necessary.

var td = $(someTDReference);
var pos = td.offset();
pos.bottom = pos.top + td.height();
pos.right = pos.left + td.width();
// pos now contains top, left, bottom, and right in pixels

Edit: Not .position(), use .offset(). Updated above.

Edit: Changed pos.width() to td.width()

这篇关于HTML元素的坐标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！