1

我正在做一个棋盘游戏。比赛完成后，棋盘会动态添加，并且根据每个玩家的屏幕大小为每个玩家确定大小。这意味着要正确放置棋子我需要知道棋盘在 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

我究竟做错了什么？我已经研究了偏移量和位置，并认为偏移量是正确的选择，但两者都没有运气。

注意：该.on()方法有效，因为如果我将板留在左上角并假设值为 0 offset.left，offset.top则此功能可以正常工作。

更新：这是抛出错误的 JQuery 行

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

这是非缩小版的第 9264 行

4

1 回答 1

-1

Maybe try accessing the attributes directly:

$(document).on('click', '#boardOverlay', function(event){
 var top = $(this).css("top");
 var left = $(this).css("left");
});
于 2012-12-30T21:45:49.480 回答