好吧,我有一个棋盘上有所有斑点和碎片。它从2D阵列生成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;
});
当我点击棋盘上的方块时,该功能会正常触发,但是当我在那里拖放棋子时,它并没有记录鼠标已经启动。然而,由于光标直接位于国际象棋棋盘上并且所述棋子和#34;阻止"光标直接位于光点上方。值得注意的是,我的HTML结构是这样的。
<board>
<spot></spot>
<piece></piece>
</board>
我的意思是,棋子,主教等不在这些地方内部,所以这个事件没有任何东西可以起泡&#34;通过
答案 0 :(得分: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
}
答案 1 :(得分:1)
(function ($) {
"use strict";
//console.log($);
$('document').ready(function () {
var target;
$('#wrapper').mousedown(function (e) {
var el = $(e.target);
if (el.hasClass('elem')) {
target = el;
}
});
$('#wrapper').mouseup(function (e) {
var el = $(e.target);
//console.log(e);
if (target) {
if (el.hasClass('kletca')) {
el.append(target);
}
}
target = undefined;
});
});
}(jQuery));
http://jsfiddle.net/32DTv/一个简单的例子