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

理论上，判断长按结束，在手机端上仅设置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. [Java]两个将秒数转化为日时分秒形式的函数

    比如900秒要反应一下,说15分就直观了.下面两个函数性能差不多,大家任意取用. 代码: import java.util.concurrent.TimeUnit; public class Test ...

  2. IfcSlab

    // IfcRoot ----------------------------------------------------------- // attributes: // shared_ptr& ...

  3. 严重性 代码 说明 项目 文件 行 禁止显示状态错误 C1128 节数超过对象文件格式限制: 请使用 /bigobj 进行编译。

    严重性 代码 说明 项目 文件 行 禁止显示状态错误 C1128 节数超过对象文件格式限制: 请使用 /bigobj 进行编译. 默认情况下,对象文件最多可存放 65,536 (2^16) 个可寻址的 ...

  4. QML渐变色

    Rectangle { id: tab_btn width: height: parent.height color: "black" gradient: Gradient { G ...

  5. 一百四十六：CMS系统之帖子按照发布时间和评论数量排序

    按照不同选项进行排序 视图 @bp.route('/')def index(): board_id = request.args.get('board_id', type=int, default=N ...

  6. PAT 甲级 1036 Boys vs Girls (25 分)（简单题）

    1036 Boys vs Girls (25 分)   This time you are asked to tell the difference between the lowest grade ...

  7. Python之汉诺塔递归运算

    汉诺塔问题是一个经典的问题.汉诺塔(Hanoi Tower),又称河内塔,源于印度一个古老传说.大梵天创造世界的时候做了三根金刚石柱子,在一根柱子上从下往上按照大小顺序摞着64片黄金圆盘.大梵天命令婆 ...

  8. maven执行过程中抛出的各类异常信息

    价值 各类异常信息分类 举例 maven源代码的模块maven-core里的各类*Exception命名的class包含里,maven执行过程中打印的各类异常日志内容 比如如下错误 错误信息分别来自( ...

  9. 线程.Qt更新界面

    1.信号&槽 机制 即可 ZC:个人暂时 测试下来,类似是 PostMessage(...)的方式: a.是在各自的线程中执行代码, b.调用 emit不耗时(指的意思是 像调用PostMes ...

  10. 查询父节点parentNode

    示例 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 <!DOCTYPE htm ...