实质上，长按的时间不应该过长，因为这有可能与手机系统的部分长按手势产生冲突，但也不宜过短，因为长按时间过短与点击没有任何区别，

理论上，判断长按结束，在手机端上仅设置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="width: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);

});

JS 长按 移动端的更多相关文章

  1. Pomelo：网易开源基于 Node.js 的游戏服务端框架

    Pomelo:网易开源基于 Node.js 的游戏服务端框架 https://github.com/NetEase/pomelo/wiki/Home-in-Chinese

  2. 用pdf.js实现在移动端在线预览pdf文件

    用pdf.js实现在移动端在线预览pdf文件1.下载pdf.js    官网地址:https://mozilla.github.io/pdf.js/ 2.配置    下载下来的文件包,就是一个demo ...

  3. 如何让Node.js运行在浏览器端

    Node.js又称服务端JavaScript.今天我为了解决一个问题,通过搜索引擎找到了如何将Node.js转成浏览器端可以运行的javascript.尽管这种方式有其局限性,但是还是可以用的. 1. ...

  4. js中模拟移动端长按效果

    我们都知道 js 是有onmousedown(鼠标按下事件)和onmouseup(鼠标抬起事件),刚开始我的思路是 鼠标抬起时间减去鼠标按下时间 var oDiv = document.getElem ...

  5. 移动端JS事件、移动端框架

    一.移动端的操作方式和PC端是不同的,移动端主要是用手指操作,所以有特殊的touch事件,touch事件包括如下几个事件: 1.手指放到屏幕上时触发   touchstart 2.手指放在屏幕上滑动式 ...

  6. 【js】手机浏览器端唤起app，没有app就去下载app 的方法

    这种功能的作用: 1.一般公司有自己的app,而app是需要不断有新用户涌入才能持续运营,达到不错的收入.就需要使用这种方式进行引入新的用户. 2.一些内容在网页端体验不好,或者一些功能需要app内才 ...

  7. 用H5和js写一个移动端自定义播放器

    前言 由于html5自带的播放器样式不怎么好看,大多数人都是自己写一个来满足业务需求.这一次的需求如下: 1.不要上一曲下一曲 2.有进度条和播放暂停按钮 3.有时间显示 demo实现功能 1.进度条 ...

  8. js IndexedDB：浏览器端数据库的demo实例

    IndexedDB具有以下特点. (1)键值对储存. IndexedDB内部采用对象仓库(object store)存放数据.所有类型的数据都可以直接存入,包括JavaScript对象.在对象仓库中, ...

  9. js动态计算移动端rem

    在做移动端web app的时候,众所周知,移动设备分辨率五花八门,虽然我们可以通过CSS3的media query来实现适配,例如下面这样: html { font-size : 20px; } @m ...

随机推荐

  1. Matlab图像处理——中值滤波medfilt2问题解决

    本文链接:https://blog.csdn.net/Pxzly1117/article/details/79201772程序: I=imread('13.jpg');%读入图像imshow(I);h ...

  2. Android：状态栏禁用时蓝牙多文件传输弹窗及进度显示

    一.蓝牙文件传输弹窗 Android原生蓝牙传输文件时,会弹出蓝牙文件接收的确认框且默认是以notification的形式显示在状态栏,当用户点击之后才会弹出一个dialog.那么当状态栏被禁用时,如 ...

  3. 使用Lock对象实现同步效果

    Lock是一个接口,为了使用一个Lock对象,需要用到   Lock lock = new ReentrantLock();   与 synchronized (someObject) 类似的,loc ...

  4. 一百四十一：CMS系统之根据板块过滤显示帖子

    视图,根据传过来的板块id查数据 @bp.route('/')def index(): board_id = request.args.get('board_id', type=int, defaul ...

  5. 【418】C语言ADT实现Quack(stack+queue)

    quack.h #include <stdio.h> #include <stdlib.h> #include <assert.h> typedef struct ...

  6. Docker Machine(十五)

    目录 一.Docker Machine 总览 1.Docker Engine VS Docker Machine 2.环境准备 二.安装 Docker Machine 1.Install Machin ...

  7. 【c# 学习笔记】所有类的父类：System.object

    在c#中,所有的类都派生自System.Object类.如果定义的类,没有直达任何基类,编译器就会自动把Object类当作它的基类.和其他类 一样,System.Object类也定义了一组共有的成员, ...

  8. npm镜像指定用淘宝镜像去下载

    使用npm下载,蜗牛,使用cnpm又觉得那啥,所以.把cnpm也就是淘宝镜像绑定成npm下载的代理,这样使用npm的时候其实是用淘宝镜像去下载,这感觉,good! 1. npm config set ...

  9. Egret入门学习日记 --- 第十七篇（书中 7.4~8.2节 内容）

    第十七篇(书中 7.4~8.2节 内容) 昨天看到 7.3 节,那么今天. 开始 7.4节.     好吧,这些其他的服务器运行知识,就不搞了... 至此,7.4节 内容结束. 开始 7.5节 内容. ...

  10. 【miscellaneous】基于gstreamer的实时转码

    目标是实现一个实时转码,可用于IPTV提供节目源.相关工作在ubuntu操作系统下进行.需要对源代码进行修改的时候,直接采用apt-get source命令获取源代码,根据需要进行修改,然后安装,这样 ...