在 mouseup() 事件中使用来自 mousedown() 的 var答案

【问题标题】：Use a var from mousedown() in the mouseup() event在 mouseup() 事件中使用来自 mousedown() 的 var
【发布时间】：2016-01-21 17:01:32
【问题描述】：

所以对于那些看过 my previous question 的人来说，我正在用完整的 JS 和 jQuery（或者至少是）构建一个棋盘。

因此，为了有效地限制我的棋子可以移动的方格数量，我需要知道它们的位置。（起止位置）

我编写了下面的代码来记录起始行（整数）和起始列（整数），并在 mousedown() 和 mouseup() 上执行此操作

var piece;
        $('div').mousedown(function(e) {
            e.preventDefault();
            var selectedRow = this.getAttribute("data-row");
            var selectedColumn = this.getAttribute("data-column");
            console.log(selectedRow, selectedColumn);
            piece = $(this).find('.pawn');
        })
        .mouseup(function() {
            var selectedRow = this.getAttribute("data-row");
            var selectedColumn = this.getAttribute("data-column");
            console.log(selectedRow, selectedColumn);
            if (selectedRow === selectedRow++ || selectedColumn === selectedColumn++){
                console.log('TRUE :D'); //Wont be true because both selectedRow's will be the same value
            }
            $(this).append(piece);
        });

据我所知，我无法比较这两个值，因为两个日志都在不同的事件中。（请记住，我对这两种语言都很陌生，而且我还在学习）。

我的问题是是否可以收集两个值（开始和结束），然后能够将它们相互比较。

【问题讨论】：

所以你说你使用 jQuery（我可以看到），但你为什么不将它用于更多的事情。例如this.getAttribute("data-row") 可以是$(this).data('row');。是的，您可以比较它们，您要么需要将变量移出事件范围，要么将它们放回 data 属性中。
@putvande 这是一件很有趣的事情，谢谢！就像我说的，我还在学习这两种语言。
@putvande 现在控制台中返回的整数颜色不同有什么原因吗？带有 $(this).data('row') 的那个是绿色的，而其他的是黄色的。这有什么原因吗？ prntscr.com/9suizc
可能是一个转换为实际整数和另一个转换为字符串（1 和'1'）之间的区别，但我不确定。
投反对票的人能否详细说明他们投反对票的原因？也许我可以改进我的问题？

标签： javascript jquery

【解决方案1】：

最简单的方法是创建一个 selectedRow_down 和 selectedColumn_down selectedRow_up 和 selectedColumn_up 在全局范围内。

var selectedRow_down;
var selectedColumn_down;
var selectedRow_up;
var selectedColumn_up;

$('div').mousedown(function(e) {
    e.preventDefault();
    var selectedRow_down = this.getAttribute("data-row");
    var selectedColumn_down = this.getAttribute("data-column");
    piece = $(this).find('.pawn');
})
.mouseup(function() {
    var selectedRow_up = this.getAttribute("data-row");
    var selectedColumn_up = this.getAttribute("data-column");
    console.log(selectedRow_up, selectedColumn_up);
    $(this).append(piece);
});

然后在执行鼠标事件时引用它的值

您也可以先制作全局二维数组，以便跟踪您的棋子，请参阅此线程如何创建二维数组 How can I create a two dimensional array in JavaScript?

【讨论】：