2012-04-23 94 views
7

是否有绑定到移动Safari的双击事件(在单行代码中)的方法?或者,另一种方法是实施拦截在一段短时间内发生的两次单击事件(例如:http://appcropolis.com/blog/implementing-doubletap-on-iphones-and-ipads/)?在移动Safari上双击

+0

双标签不用于缩放吗?是否在浏览器中触发了2次轻击事件? – Undefined 2012-04-23 09:47:01

+0

同样的事件,用于缩放,我想重写具体给定情况下的行为 – BreakPhreak 2012-04-23 09:49:18

+0

对不起,如果我不涉及到你的问题,但如果你显示一个网页,你可以指定视口设置的元标记。你可以从snippetspace的iwebkit中看到这个。 – 2012-05-17 16:45:02

回答

6

简答:您必须通过两次点击来实现。

实际答案:这里是一个jQuery - 自由执行双敲击移动Safari浏览器仅需要一行代码(以启用DBLCLICK事件):

此外,您可能需要使用此元标记disable mobile Safari's default zoom

<meta name="viewport" content="width=device-width,user-scalable=no" /> 
0

覆盖dblclick事件并使用bindliveondelegate像任何其他事件:如果你想有工作请双击浏览器和IOS平台既

jQuery.event.special.dblclick = { 
    setup: function(data, namespaces) { 
     var elem = this, 
      $elem = jQuery(elem); 
     $elem.bind('touchend.dblclick', jQuery.event.special.dblclick.handler); 
    }, 

    teardown: function(namespaces) { 
     var elem = this, 
      $elem = jQuery(elem); 
     $elem.unbind('touchend.dblclick'); 
    }, 

    handler: function(event) { 
     var elem = event.target, 
      $elem = jQuery(elem), 
      lastTouch = $elem.data('lastTouch') || 0, 
      now = new Date().getTime(); 

     var delta = now - lastTouch; 
     if(delta > 20 && delta<500){ 
      $elem.data('lastTouch', 0); 
      $elem.trigger('dblclick'); 
     }else 
      $elem.data('lastTouch', now); 
    } 
}; 
+0

适用于safari,但不适用于桌面镀铬 – alpere 2014-02-11 08:24:47

3

,你应该有下面的代码:

jQuery.event.special.dblclick = { 
    setup: function(data, namespaces) { 
     var agent = navigator.userAgent.toLowerCase(); 
     if (agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0 || agent.indexOf('ipod') >= 0) { 
      var elem = this, 
       $elem = jQuery(elem); 
      $elem.bind('touchend.dblclick', jQuery.event.special.dblclick.handler); 
     } else { 
      var elem = this, 
       $elem = jQuery(elem); 
      $elem.bind('click.dblclick', jQuery.event.special.dblclick.handler); 
     } 
    }, 
    teardown: function(namespaces) { 
     var agent = navigator.userAgent.toLowerCase(); 
     if (agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0 || agent.indexOf('ipod') >= 0) { 
      var elem = this, 
       $elem = jQuery(elem); 
      $elem.unbind('touchend.dblclick'); 
     } else { 
      var elem = this, 
       $elem = jQuery(elem); 
      $elem.unbind('click.dblclick', jQuery.event.special.dblclick.handler); 
     } 
    }, 
    handler: function(event) { 
     var elem = event.target, 
      $elem = jQuery(elem), 
      lastTouch = $elem.data('lastTouch') || 0, 
      now = new Date().getTime(); 
     var delta = now - lastTouch; 
     if (delta > 20 && delta < 500) { 
      $elem.data('lastTouch', 0); 
      $elem.trigger('dblclick'); 
     } else { 
      $elem.data('lastTouch', now); 
     } 
    } 
}; 

尝试在这里:

http://jsfiddle.net/UXRF8/

+0

真棒代码。完美工作。 – 2017-08-08 04:53:30