jQuery ContextMenu事件在IOS 8.2中不起作用 [英] jQuery ContextMenu event not working in IOS 8.2

查看:228
本文介绍了jQuery ContextMenu事件在IOS 8.2中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在.html示例中使用contextMenu事件,当我长按DIV时将触发该事件,但现在它不起作用.在最新的IOS 8.2版本中有问题.这是示例代码,

I am using contextMenu event in .html sample, it will be fired when i long press on an DIV, but right now it is not working. Is something broken in latest IOS 8.2 version. Here is the sample code,

<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/

请有人帮我解决这个问题.

Please someone help me with this.

推荐答案

基本上,在iOS上,触摸事件不会被模拟为鼠标事件. 改用触摸事件:"touchstart","touchmove"和"touchend".

Basically, on iOS, touch events are not emulated as mouse events. Use touch events instead: "touchstart", "touchmove" and "touchend".

在您的情况下,在iOS上(与Android相反),长时间触摸屏幕时不会触发"contextmenu". 要在iOS上自定义长按,您应使用类似以下内容的

In your case, on iOS and contrary to Android, "contextmenu" is not triggered when screen is long touched. To customize long touch on iOS you should use something like:

// 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
      }
  });

这是一个页面,其中(其中包括)说明触摸事件不会在每个OS上都被模拟为鼠标事件: http://www.html5rocks.com/en/mobile/touchandmouse/

Here is a the page explaining (among other) that touch events are not emulated as mouse events on every OS: http://www.html5rocks.com/en/mobile/touchandmouse/

希望这会有所帮助,我花了很长时间才弄清楚;)

Hope this helps, it took to me a long time to figured it out ;)

这篇关于jQuery ContextMenu事件在IOS 8.2中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆