獲取動態添加元素的位置

我在製作棋盤遊戲。在比賽結束後，棋盤將被動態添加，並且每個棋手根據其屏幕尺寸確定其大小。這意味着妥善安置件我需要知道董事會是在DOM獲取動態添加元素的位置

$(document).on('click', '#boardOverlay', function(event){ 

    event.preventDefault(); 

    var offset = $(this).offset(); 

    alert("offset.left: " + offset.left + " offset.top: " + offset.top); 

    var move = {}; 

    var mouseX = event.pageX - offset.left; 
    var mouseY = event.pageY - offset.top; 


    move.Y = Math.floor(mouseX/board.piece_length); 
    move.X = Math.floor(mouseY/board.piece_length); 

    socket.emit('move', move, board.color); 

});

警示語句被執行的Chrome在我拋出這個錯誤

> Uncaught TypeError: Cannot read property 'clientTop' of null jquery.min.js:4

我在做什麼錯了嗎？我已經看過offset和position，並認爲抵消是正確的選擇，但沒有運氣。

注：的.on()梅索德工作，因爲如果我離開董事會在左上角和承擔的0值offset.left和offset.top此功能工作正常。

更新：這裏是拋出錯誤

clientTop = docElem.clientTop || body.clientTop || 0;

這是無精縮版線9264

來源

2012-12-30 Loourr

總是使用jQuery的完整開發版本進行調試......可以查看正在使用的行，並更好地瞭解調用該行的內容。縮小版本太難以拒絕 – charlietfl

那是你的意思下載開發者版本並鏈接到那個？目前我正在使用'' – Loourr

just just remove來自url的'.min'。谷歌有兩個版本。然後將獲得數以千計的行號，並在控制檯中可以點擊並查看正在使用的方法 – charlietfl

-1

也許嘗試直接訪問屬性JQuery的行：

$(document).on('click', '#boardOverlay', function(event){ 
var top = $(this).css("top"); 
var left = $(this).css("left"); 
});

來源

2012-12-30 21:45:49 matt

它的返回undefined爲這兩個。我不認爲div標籤具有'left'和'right'屬性 – Loourr

'top'和'left'不是屬性......它們是'style'屬性的一部分（如果在css中定義的話）。也不同於'offset'，它是文檔 – charlietfl

中的位置@charlietfl是的，您將範例更改爲.css而不是。attr – matt

獲取動態添加元素的位置

回答

相關問題