Touchstart和Touchmove事件不起作用

Question

我有一个瓷砖地板设计师。该代码允许用户单击以使用画布上的选定图块来填充网格中的各个正方形，或者通过拖动鼠标来填充来更快地填充。桌面可以正常工作，但在iPhone上，它只能让您通过触摸一个接一个地填充网格。

我尝试添加侦听器以及绑定，但是我似乎无法使其正常工作。我注释掉了鼠标事件。

/*mouse code $(canvas).bind("mousedown touchstart", function(e) {
$(canvas).bind("mousemove touchmove", function(e) {*/

$(canvas).bind("mousedown touchstart", function(e) {
$(canvas).bind("mousemove touchmove", function(e) {
  if (tileNumber != 0) {
    function fill(s, gx, gy) {
        ctx.fillStyle = s;
        if (tabTitle == "Edge" || tabTitle == "edge") {
          if (gy > h - 1) {
            ctx.fillRect(gx * size, canvas.height - edgeSize, size, edgeSize);
          }
        } else if (tabTitle == "Corner") {
          if (gx > w - 1 && gy > h - 1) {
            ctx.fillStyle = "#f7f7f7";
            ctx.fillRect(gx * size, gy * size, size, size);
            ctx.fillStyle = s;
            if (tileAlign == "top left") {
              ctx.fillRect(gx * size, gy * size, edgeSize, edgeSize);
            } else if (tileAlign == "top right") {
              ctx.fillRect((gx * size) + (size - edgeSize), gy * size, edgeSize, edgeSize);
            } else if (tileAlign == "bottom left") {
              ctx.fillRect(gx * size, (gy * size) + (size - edgeSize), edgeSize, edgeSize);
            } else if (tileAlign == "bottom right") {
              ctx.fillRect((gx * size) + (size - edgeSize), (gy * size) + (size - edgeSize), edgeSize, edgeSize);
            } else {
              ctx.fillRect(gx * size, gy * size, edgeSize, edgeSize);
            };
          }
        } else {
          ctx.fillRect(gx * size, gy * size, size, size);
        };
        ctx.fillStyle = "#000000"
        ctx.fillStyle = ctx.createPattern(base_image, "repeat");
        ctx.fillRect(gx * size, gy * size, size, size);
        ctx.strokeRect(gx * size, gy * size, size, size);
    }
    // reset
    prodIdDetail = "";

    // get mouse click position
    var mx = e.offsetX;
    var my = e.offsetY;

    // calculate grid square numbers
    var gx = ~~ (mx / size);
    var gy = ~~ (my / size);

    fill(fillTile, gx, gy);

    // populate my dictionary with tile locations
    if (tabTitle == "Edge" || tabTitle == "edge") {
      if (gy > h - 1) {
        gridModel[gx + "." + gy + ".edge"] = properName;
      }
    } else {
      gridModel[gx + "." + gy] = properName;
    };


    // dubugging
    //console.log("Down")
  };
});
});