javascript - 返回元素上的事件不会在 jQuery 中触发

Question

好的，我有一个棋盘，里面有所有的棋子和棋子。它是用二维数组中的两个四周期生成的 onload。这个想法是，你应该能够拖动一个棋子(我已经正确实现的东西)，然后让它进入一个有效的位置。放手部分应该在实际的棋盘位置触发一个事件。所以 64 个点中的每一个都有一个看起来像这样的均匀听众。

element.on("mouseup",function(e){
                if(Game.current==undefined||!$(this).hasClass("valid")){return;}
                var col,row;
                col = $(this).attr("column");
                row = $(this).attr("row");
                Game.current.attr({
                    "column":col,
                    "row":row
                });
                Game.move(Game.current);
                Game.changeTurn();
                Game.current = undefined;

            });

当我点击棋盘上的一个方 block 时，该函数正常触发，但是当我将一个棋子拖放到那里时，它不会记录鼠标已抬起。它让我们离开棋子，但是因为光标直接在棋子上方并且所述棋子“阻止”光标直接位于该点上方。还值得注意的是，我的 HTML 结构是这样的。

<board>
    <spot></spot>
    <piece></piece>
</board>

我的意思是，兵、主教等不在地点内，因此事件没有任何可“冒泡”的东西。

Answer 1

更好的方法是将 mouseup 的监听器附加到窗口对象上，做这样的事情

$(window).on('mouseup', on_mouse_up );

然后，根据鼠标位置计算出正确的位置。

function on_mouse_up( e ) {
    // Get the mouse position
    x = e.pageX;
    y = e.pageY;

    // Calculate the spot from the mouse position

}