javascript - 移动棋子的位置

标签 javascript jquery html

我正在创建一个跳棋变异游戏。 我是 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/

谢谢。

最佳答案

$('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');
    }
});​

关于javascript - 移动棋子的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13665978/

相关文章:

javascript - JS 脚本仅在嵌入 scala/html 代码中时才有效

javascript - 如果 xAxis 勾选,Highchart 数据标 checkout 现在中间

javascript - Angular:添加额外的 js 时未捕获语法错误

html - 无法让任何图像用作 CSS 中的背景图像

javascript - 如何用一个函数逐步显示div?

javascript - 我的 Android 平板电脑 4.4 版本无法自动播放视频

jquery - 如果函数返回 jQuery AJAX 输出作为返回

jquery - div 元素之间的空间随着每个新的 div 呈指数级增长

javascript - 在 JQuery 中显示/隐藏打印按钮?

带有许多 html 页面的 javascript