2011-05-07 116 views
0

我很想嘗試黑客添加一個功能到插件。獲取屏幕座標的css

我的情況是,div覆蓋在具有許多單元格的表格的頂部。這個div橫跨它下面的表格的許多單元格。但它並沒有嵌入表格中 - 如前所述;但實際上在屏幕上設置了絕對的x,y座標。

如果我點擊浮動DIV我可以得到jsEvent鼠標座標x,y ..

我怎樣才能再使用這些座標來獲得像在該座標例如細胞類的所有元素的CSS更多的數據,id等直接點擊x,y?或者直接在下面或上面的所有單元格。

我想使用jQuery。有什麼建議麼。

+0

唯一的跨瀏覽器的方式是循環遍歷每個td元素,使用鼠標座標檢查每個偏移量。爲什麼不能使用'$('td')。click(function(){...});'? – grc 2011-05-07 11:54:19

+0

,因爲我沒有點擊實際的表格。我點擊不在表格內部的表格頂部的div。所以td點擊將永遠不會開火,除非我點擊td而不是浮動div ..見? – ppumkin 2011-05-07 11:57:03

+0

但通過所有td的想法是不錯的想法,但非常無益..任何其他建議? – ppumkin 2011-05-07 11:59:54

回答

2

這應該工作(其中mousex和像老鼠是COORDS):

$('td').each(function(index) { 
    var offset = $(this).offset(); 
    if ((offset.left + $(this).outerWidth()) > mousex && offset.left < mousex && (offset.top + $(this).outerHeight()) > mousey && offset.top < mousey) { 
     // $(this).css... 
    } 
    }); 
+0

是啊,寶貝!多數民衆贊成在! – ppumkin 2011-05-07 12:29:59

1

像這樣:

$("#div").click(function(event){ 
    var x = event.pageX, y = event.pageY; 
    var $clickedTd = $("#table td").filter(function(){ 
    var tdx = $(this).offset().left, tdy = $(this).offset().top; 
    var tdw = $(this).width(), tdh = $(this).height(); 
    return (x >= tdx && x <= tdx+w && y >= tdy && y <= tdy + tdh); 
    }); 
    //Here you have a reference to the clicked cell in $clickedTd. use it as you want; 
}); 

我們正在做的是找到TD,這只是在地方我們點擊(獲取div點擊座標)。

乾杯

+0

我看着你的,但grx似乎更清潔 - 它的工作複製和粘貼。謝謝你的回答!不知道效率,但.. – ppumkin 2011-05-07 12:30:43