• JS 长按 移动端


    实质上,长按的时间不应该过长,因为这有可能与手机系统的部分长按手势产生冲突,但也不宜过短,因为长按时间过短与点击没有任何区别,
    理论上,判断长按结束,在手机端上仅设置mouseup动作就可以,

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>无标题文档</title>  
    <script type="text/javascript" src="js/jquery-1.11.1.js"></script>  
      
    </head>  
      
    <body>  
    <div id="mydiv" style="100px; height:100px; background:#ddd;">out</div>  
    </body>  
    </html>  
      
    <script>  
    /*设置一个长按的计时器,如果点击这个图层超过2秒则触发,mydiv里面的文字从out变in的动作*/  
    var timeout ;  
       
    $("#mydiv").mousedown(function() {  
        timeout = setTimeout(function() {  
            $("#mydiv").text("in");  
        }, 2000);  
    });  
       
    $("#mydiv").mouseup(function() {  
        clearTimeout(timeout);  
        $("#mydiv").text("out");  
    });  
      
    $("#mydiv").mouseout(function() {  
        clearTimeout(timeout);  
        $("#mydiv").text("out");  
    });  
      
    </script>
    

    手机端js模拟长按事件(代码仿照jQuery)
    代码编写:

    $.fn.longPress = function(fn) {
        var timeout = undefined;
        var $this = this;
        for(var i = 0;i<$this.length;i++){
            $this[i].addEventListener('touchstart', function(event) {
                timeout = setTimeout(fn, 800);
                }, false);
            $this[i].addEventListener('touchend', function(event) {
                clearTimeout(timeout);
                }, false);
        }
    }
    

    代码使用:

    $(select).longPress(function(){
        alert(1);
    });
    
  • 相关阅读:
    维护没有源代码的遗留 Java 项目
    项目管理软件
    Web系统页面打印技术实现与分析
    包饺子
    深入理解浏览器兼容性模式
    无法加载ISAPI 筛选器 当前配置只支持加载为 AMD64 处理器体系结构创建的映像
    命令行下IIS的配置脚本Adsutil.vbs
    浏览器开发工具的秘密
    高速公路坐标高程计算软件3.6版本发布
    VB模拟键盘输入的N种方法
  • 原文地址:https://www.cnblogs.com/humi/p/8275558.html
Copyright © 2020-2023  润新知