如何在移动设备上启用 Long-Touch
How to Enable Long-Touch on Mobile Devices
我正在尝试让我下载的 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 日历中的星期日,然后是下一个星期六。
我看不到您的演示,但是,我相信您正在寻找 Hammer.js and more specifically the Press Recognizer。您应该能够修改当前的点击处理程序以使用 Hammer 事件。我希望这能为您指明正确的方向。
我正在尝试让我下载的 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 日历中的星期日,然后是下一个星期六。
我看不到您的演示,但是,我相信您正在寻找 Hammer.js and more specifically the Press Recognizer。您应该能够修改当前的点击处理程序以使用 Hammer 事件。我希望这能为您指明正确的方向。