有没有办法通过单击一次 javascript 来选择多个表格单元格？

Question

我基本上已经通过javascript增加了网页上的光标图标大小，并且我有一个表格。现在，我希望表格中所有带有光标图标的重叠元素都可以更改其背景颜色（单击和拖动时）。这意味着更改 mousedown 或 mouseover 当前能够选择的区域并能够选择多个元素。有没有办法做到这一点，如果有怎么办？

点击代码如下：

     $('td').on('mousedown', function (e1) {
    loop();
    flag = 1
    $('td').on('mousemove', function (e2) {
        console.log(document.elementsFromPoint(e2.pageX, e2.pageY))
        if (flag == 1) {
            var tableCell = $(this);
            var setbox = $('.active').attr('id');
            //document.getElementById("tableBack").style.cursor="move";
            switch (setbox) {
                case "lPark":
                    //$(this).text('P');
                    $(this).css('background-color', 'green');
                    break;
            }
        }
    }
}

这是增加光标大小的代码：

var cursor = document.createElement('canvas'),
ctx = cursor.getContext('2d');

cursor.width = 100;
cursor.height = 100;
var centerX = cursor.width / 2;
var centerY = cursor.height / 2;
var radius = 40 ;

ctx.beginPath();
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
ctx.fillStyle = 'green';
ctx.fill();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
//document.getElementById("tableBack").style.cursor="move";
// set image as cursor (modern browsers can take PNGs as cursor).
document.getElementById("tableBack").style.cursor = 'url(' + cursor.toDataURL() + '), auto';

这是我正在尝试做的图片

http://imgur.com/a/i3pEp（对不起，我没有足够的积分来嵌入）

注意光标在 4 个单元格上，但只有 1 个被选中，我想全选 4 个。

Answer 1

我以某种方式试图理解您的查询。看，你当然可以做一件事。

有很多方法可以做到这一点。但是，这里有一个我建议的算法。

1) capture ctrl key pressed event and save a flag value (suppose boolean) in some hidden field say x;
  1.1) On Key down save true in x
  1.2) On Key up save false in x
2) now while it is running caputre your mouse click on cell
  if( x==true)
      add some highlight class on that cell (which is clicked)
  else
      remove some highlight class on that cell
3) now for you entire table/grid you have got your highlighted class on items you've selected

每个阶段都可以根据要求进行编码。希望能给大家一些启发。