zoukankan      html  css  js  c++  java
  • 移动端-解决ios连续点击页面上移问题

    引入js即可

    //解决ios双击页面上移问题
    //在项目中测试不紧input/button这些表单控件有这个问题,p,div等也有问题,于是乎就直接在body开刀了
    (function()
    {
    var agent = navigator.userAgent.toLowerCase(); //检测是否是ios
    var iLastTouch = null; //缓存上一次tap的时间
    if (agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0)
    {
    document.body.addEventListener('touchend', function(event)
    {
    var iNow = new Date()
    .getTime();
    iLastTouch = iLastTouch || iNow + 1 /** 第一次时将iLastTouch设为当前时间+1 */ ;
    var delta = iNow - iLastTouch;
    if (delta < 500 && delta > 0)
    {
    event.preventDefault();
    return false;
    }
    iLastTouch = iNow;
    }, false);
    }

    })();

    //下面是国外coder给的解决方案
    //http://appcropolis.com/blog/howto/implementing-doubletap-on-iphones-and-ipads
    (function($){
    // Determine if we on iPhone or iPad
    var isiOS = false;
    var agent = navigator.userAgent.toLowerCase();
    if(agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0){
    isiOS = true;
    }

    $.fn.doubletap = function(onDoubleTapCallback, onTapCallback, delay){
    var eventName, action;
    delay = delay == null? 500 : delay;
    eventName = isiOS == true? 'touchend' : 'click';

    $(this).bind(eventName, function(event){
    var now = new Date().getTime();
    var lastTouch = $(this).data('lastTouch') || now + 1 /** the first time this will make delta a negative number */;
    var delta = now - lastTouch;
    clearTimeout(action);
    if(delta<500 && delta>0){
    if(onDoubleTapCallback != null && typeof onDoubleTapCallback == 'function'){
    onDoubleTapCallback(event);
    }
    }else{
    $(this).data('lastTouch', now);
    action = setTimeout(function(evt){
    if(onTapCallback != null && typeof onTapCallback == 'function'){
    onTapCallback(evt);
    }
    clearTimeout(action); // clear the timeout
    }, delay, [event]);
    }
    $(this).data('lastTouch', now);
    });
    };
    })(Zepto);

    //usage:
    $(selector).doubletap(
    /** doubletap-dblclick callback */
    function(event){
    alert('double-tap');
    },
    /** touch-click callback (touch) */
    function(event){
    alert('single-tap');
    },
    /** doubletap-dblclick delay (default is 500 ms) */
    400
    );
    //下面是国外coder给的解决方案--end
    //解决ios双击网面上移问题--end
  • 相关阅读:
    jdbc和DBeaver客户端连接oracle很慢,初始化连接成功后速度正常
    centos7中vncserver连接失败
    postgres数据库建库、修改owner
    nested exception is org.apache.ibatis.binding.BindingException:
    postgresql导出表insert方式数据
    解决ecllipse注释模板不生效问题
    postgresql 修改表属性,包括新增、修改、删除列
    ssh本机可登陆远端服务器,但远端服务器无法登陆本机
    linux源码安装后,设置动态库路径和环境变量
    valgrind跟踪调试动态库*.so
  • 原文地址:https://www.cnblogs.com/wang715100018066/p/6008371.html
Copyright © 2011-2022 走看看