1

チェッカーバリエーションゲームを作成しています。私はjqueryを初めて使用しますが、いくつかの助けを借りて、ピースをボード上で移動できるようになりました。

移動の開始位置と終了位置を示す方法はありますか？

また、移動が完了したら、すべてのピースの移動を無効にします。

現在のコード：

$('img').draggable();
$('#tbl td').droppable({
hoverClass: 'over',
drop: function(event, ui) {
    var cell = ui.draggable.appendTo($(this)).css({
        'left': '0',
        'top': '0'
    });
    var row = cell.closest('tr').prevAll().length + 1;
    var col = cell.closest('td').prevAll().length + 1;
    $('#coords').html('Row ' + row + ', Col ' + col);
  }
});

jsfiddle http://jsfiddle.net/blueberrymuffin/bLb3H/

ありがとう。

4

2 に答える 2

0

私はそれを理解したと思います。コードは次のとおりです。

$('img').draggable({
start: function(e, ui) {          
var myCol = $(this).closest("td").index() + 1;
var myRow = $(this).closest("tr").index() + 1;
$('#coords').html('Row ' + myRow + ', Col ' + myCol);            
},
});
$('#tbl td').droppable({
hoverClass: 'over',
drop: function(event, ui) {
    var cell = ui.draggable.appendTo($(this)).css({
        'left': '0',
        'top': '0'
    });
    var row = cell.closest('tr').prevAll().length + 1;
    var col = cell.closest('td').prevAll().length + 1;
    $('#coords').html('Row ' + row + ', Col ' + col);
    $('img').draggable('disable');
}
});

と jsfiddle: http://jsfiddle.net/bLb3H/5/

現在の画像をドラッグされた新しい画像に置き換える方法はわかりません（現在、両方の画像が同じセルを占めています）。何か案は？

ありがとう。

于 2012-12-02T07:00:28.430 に答える
0 
$('img').draggable({
    start: function(e, ui) {
        alert('Starting move from position (' + ui.position.top + ', ' + ui.position.left + ')');
    },
    stop: function(e, ui) {
        alert('Ending move at position (' + ui.position.top + ', ' + ui.position.left + ')');
    }
});
$('#tbl td').droppable({
    hoverClass: 'over',
    drop: function(event, ui) {
        var cell = ui.draggable.appendTo($(this)).css({
            'left': '0',
            'top': '0'
        });
        var row = cell.closest('tr').prevAll().length + 1;
        var col = cell.closest('td').prevAll().length + 1;
        $('#coords').html('Row ' + row + ', Col ' + col);
        $('img').draggable('disable');
    }
});​
于 2012-12-02T03:36:02.773 に答える