我有一系列div,代表类似棋盘。但这是一个有点棘手的国际象棋。基本上用户点击一块,然后点击敌人的一块。如果它可以杀死。它应该移动到敌人的位置。并且应该删除敌人。
<div class="column" data-square="4-4">
<div class="white-king lol">a</div>
</div>
<div class="column" data-square="4-5">
<div class="black-pawn lol">b</div>
</div>
<div class="column" data-square="4-6">
<div class="blue lol">c</div>
</div>
//所以当用户第一次点击whiteking时,我们得到数据平方,将其分配给变量$ from,然后点击敌人的黑棋子。在服务器中进行一些验证,并应移动
方形的内部div = 4-4到方形的内部div = 4-5,方形的内部div = 4-5应该被删除,而square = 4-4的内部div应该是presnet
我尝试过使用jquery clone。但它不是很好 小提琴:http://jsfiddle.net/jm4eb/13/
答案 0 :(得分:0)
这不是好方法,但你可以尝试
(function() {
var from = null;
var $change =null;
var to = null;
$(".column" ).click(function(){
if(from === null)
{
$(this).css("background-color","yellow");
from = $(this).data('square');
$change= ($('<div/>').append($(this).clone(true).children()).html());
}
else
{
to = $(this).data('square');
$(this).html("").html($change);
$('div[data-square="'+from+'"]').html("<div class=lol>empty</div>").css("background-color","");
from = to = null;
}
});
}());
答案 1 :(得分:0)
我个人不会因为用另一个元素替换一个元素而变得太弯曲。我会看一下将属性从一个元素交换到另一个元素。从一个元素中删除white-king
类并将其添加到另一个元素。