如何在移动设备上启用 Long-Touch

Question

我正在尝试让我下载的 time-sheet 演示应用程序运行，以便 right-click 事件在移动触摸屏上运行（带有 long-touch）。该应用程序是一个 jQuery table（我已经修改，因此它可以编辑和保存 time-sheets），其中值 1 或 0 根据 [=] 中设置的设置背景颜色42=]。您可以单击或 right-click 列 header（用颜色填充整个列）或单个单元格来更改其颜色。除了移动浏览器中的 right-click 外，一切都完美无缺。所有这些都适用于桌面浏览器，但由于该应用程序只能在移动浏览器中使用，因此用处不大。最初在 long-touching 时触摸屏上没有任何反应（什么都不可见），但后来我禁用了 right-click 代码以隐藏上下文菜单，现在在按下一个单元格约 500 毫秒后屏幕会瞬间闪烁。所以它试图做点什么？但我真的很想再次禁用它。

我真的不知道从哪里开始。我看到的所有示例代码似乎都是为了开始新的代码，而不是编辑现有代码（看起来与我在任何示例中看到的都不一样）。我真的很希望这最终能奏效，所以 left-click 选择一种颜色，下一个 left-click 选择另一种颜色。但是现在触摸屏工作 right-click/long-touch 事件会很棒。

这是解释点击并将变量设置为 1 或 0 的代码（我相信）：

if(key[0]===1){ targetState = 1;}   //Left mouse button to set the selected area to 1
else if(key[0]===3){ targetState = 0;}   //Right mouse button to set the selected area to 0

它来自这个更大的代码块（如果有帮助，我可以 post 更多）：

    var afterSelecting = function(ev,targetArea){
        var curDom = $(ev.currentTarget);
        var key = $(ev.which);
        var targetState = undefined;

        if(key[0]===1){       targetState = 1;}   //Left mouse button to set the selected area to 1
        else if(key[0]===3){ targetState = 0;}   //Right mouse button to set the selected area to 0

        if(isSelecting && curDom.hasClass("TimeSheet-cell") || isColSelecting && curDom.hasClass("TimeSheet-colHead")){
            sheetModel.set(targetState,{
                startCell : targetArea.topLeft,
                endCell   : targetArea.bottomRight
            });
            removeSelecting();
            repaintSheet();
            if(sheetOption.end){
                sheetOption.end(ev,targetArea);
            }
        }else{
            removeSelecting();
        }

        isSelecting = false;
        isColSelecting = false;
        operationArea = {
            startCell : undefined,
            endCell : undefined
        }
    };

或此处的 test/demo 应用程序，可以在其中查看文件（在 chrome、firefox 和 edge 中测试正常）并且需要启用 cookie 以设置 time-sheet 来自日历。:

(授权 demo:demo99) http://flakie.epizy.com

要使演示正常工作，您必须 select 日历中的星期日，然后是下一个星期六。

Answer 1

我看不到您的演示，但是，我相信您正在寻找 Hammer.js and more specifically the Press Recognizer。您应该能够修改当前的点击处理程序以使用 Hammer 事件。我希望这能为您指明正确的方向。

如何在移动设备上启用 Long-Touch

How to Enable Long-Touch on Mobile Devices

javascript

jquery

touch

mouseevent