jQuery ContextMenu 事件在 IOS 8.2 中不起作用
Posted
技术标签:
【中文标题】jQuery ContextMenu 事件在 IOS 8.2 中不起作用【英文标题】：jQuery ContextMenu event not working in IOS 8.2 【发布时间】：2015-05-27 13:11:43 【问题描述】：我在 .html 示例中使用 contextMenu 事件，当我长按 DIV 时它会被触发，但现在它不起作用。在最新的 ios 8.2 版本中是否有问题。这是示例代码，
<head>
<title></title>
<script src="Scripts/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function ()
$("#content").on("contextmenu", function ()
alert("CM");
);
);
</script>
</head>
<body>
<div id="content" style="height:300px; width:300px; background-color:gray;"></div>
</body>
这是工作示例
http://jsfiddle.net/4zu1ckgg/
请有人帮我解决这个问题。
【问题讨论】：
【参考方案1】：基本上，在 iOS 上，触摸事件不会模拟为鼠标事件。 改用触摸事件：“touchstart”、“touchmove”和“touchend”。
在您的情况下，在 iOS 上，与 android 不同，长时间触摸屏幕时不会触发“上下文菜单”。 要在 iOS 上自定义长触摸，你应该使用类似的东西：
// Timer for long touch detection
var timerLongTouch;
// Long touch flag for preventing "normal touch event" trigger when long touch ends
var longTouch = false;
$(touchableElement)
.on("touchstart", function(event)
// Prevent default behavior
event.preventDefault();
// Test that the touch is correctly detected
alert("touchstart event");
// Timer for long touch detection
timerLongTouch = setTimeout(function()
// Flag for preventing "normal touch event" trigger when touch ends.
longTouch = true;
// Test long touch detection (remove previous alert to test it correctly)
alert("long mousedown");
, 1000);
)
.on("touchmove", function(event)
// Prevent default behavior
event.preventDefault();
// If timerLongTouch is still running, then this is not a long touch
// (there is a move) so stop the timer
clearTimeout(timerLongTouch);
if(longTouch)
longTouch = false;
// Do here stuff linked to longTouch move
else
// Do here stuff linked to "normal" touch move
)
.on("touchend", function()
// Prevent default behavior
event.preventDefault();
// If timerLongTouch is still running, then this is not a long touch
// so stop the timer
clearTimeout(timerLongTouch);
if(longTouch)
longTouch = false;
// Do here stuff linked to long touch end
// (if different from stuff done on long touch detection)
else
// Do here stuff linked to "normal" touch move
);
这是解释（除其他外）触摸事件在每个操作系统上都不会被模拟为鼠标事件的页面：http://www.html5rocks.com/en/mobile/touchandmouse/
希望这会有所帮助，我花了很长时间才弄明白；）
【讨论】：
如果我想为整个输入框禁用 $(touchableElement) 应该写什么 “touchend”回调是否应该接受event作为参数？
根据我的经验，我不得不从“touchmove”的处理程序中删除longTouch = false; - 似乎我的 android 的 Chrome 的敏感度太高或其他什么 - 如果没有，我永远无法进入“touchend”之间至少有一个“touchmove”以上是关于jQuery ContextMenu 事件在 IOS 8.2 中不起作用的主要内容，如果未能解决你的问题，请参考以下文章