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

var oDiv = document.getElementById('div1');
var timer1;
var timer2;
oDiv.onmousedown = function () {
  timer1 = new Date();
}
oDiv.onmouseup = function () {
  timer2 = new Date();
  var timer3 = timer2.getTime() - timer1.getTime();
  if (timer3 > 1000)
    alert('aa');
  }
}

这么写倒是也能实现 但是 必须要 鼠标抬起才能触发(鼠标按住10秒不松开,也不会出现效果。。。实际测试效果很不爽,感觉特别扭)。这个跟咱们安卓的使用感觉是不同的。。。安卓的那个长按 是 按住开始计时到时间就立马出现效果,
于是最终改版如下:

var oDiv = document.getElementById('div1')
var myVar;
oDiv.onmousedown = function () {
myVar = setTimeout(function () {
  alert('aa');
 }, 1000);
}
oDiv.onmouseup = function () {
  clearTimeout(myVar);
}

js中模拟移动端长按效果的更多相关文章

  1. 【转】js 中导出excel 较长数字串会变为科学计数法

    [转]js 中导出excel 较长数字串会变成科学计数法 在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串 ...

  2. js 中导出excel 较长数字串会变成科学计数法

    在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串转换成 科学计数法.现在网上找到解决方案之一: (在数字串 ...

  3. js 中导出excel 较长数字串会变成科学计数法(转载)

    在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串转换成 科学计数法.现在网上找到解决方案之一: (在数字串 ...

  4. 在JS中模拟表单的post提交,进行页面的跳转

    原文链接:https://blog.csdn.net/jal517486222/article/details/83147761 /* *功能: 模拟form表单的提交 *参数: URL 跳转地址 P ...

  5. js中网页图片自动更换的效果

    <script> var arr=new Array(); arr[]="url(images/city.jpg)"; arr[]="url(images/d ...

  6. JS中关于 一个关于计时器功能效果的实现

    optionSearch(); function optionSearch() { //定义一个清除计时器的变量 var timer = null; //自选标题区域 $("#optiona ...

  7. js中模拟a标签的点击事件

    var a = document.createElement('a'); a.target = "_blank"; a.href = "personal"; a ...

  8. JS 中的自定义事件和模拟事件

    在 JS 中模拟事件指的是模拟 JS 中定义的一些事件,例如点击事件,键盘事件等. 自定义事件指的是创建一个自定义的,JS 中之前没有的事件. 接下来分别说一下创建这两种事件的方法. 创建自定义事件 ...

  9. 谈一谈原生JS中的【面向对象思想】

           [重点提前说:面向对象的思想很重要!]         最近开始接触学习后台的PHP语言,在接触到PHP中的面向对象相关思想之后,突然想到之前曾接触的JS中的面向对象思想,无奈记性太差, ...

随机推荐

  1. 编译Uboot时出错:【已解决】 /bin/bash: arm-linux-gcc: command not found dirname: missing operand Try 'dirname --help' for more information.

    编译Uboot时出错: 错误信息如下: /bin/bash: arm-linux-gcc: command not found dirname: missing operand Try 'dirnam ...

  2. Javascript模块化编程(一):模块的写法 (转)

    Javascript模块化编程(一):模块的写法 原文作者: 阮一峰 日期: 2012年10月26日 随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞 ...

  3. 测量定位实践-:C#采集控制

    用Halcon已经完成采集,在在C#中不行. 其实还是比较简单,主要是Halcon封装的太好了. 主要是以下几个算子: *打开 Image Acquisitionopen_framegrabber ( ...

  4. 结合Excel批量操作网页,模拟登陆

    有这样一个场景,客户的一批账户密码保存在Excel中,需要逐一登录,进行某些操作 从头开始来的话很麻烦,读取Excel,安装Web控件,主要是控件操作没有很方便,有没有类似原始js调用.jqurey调 ...

  5. Python2.7.8 setuptools 下载及安装方法

    Python2.7.8  setuptools 下载及安装方法 电脑配置:联想笔记本电脑 windows8系统 Python版本:2.7.8 本文章撰写时间:2014.12.11 作者:陈东陈 阅读说 ...

  6. JS 对象基本用法

    声明对象的两种语法 let obj = { 'name': 'frank', 'age': 18 } let obj = new Object({'name': 'frank'}) 如何删除对象的属性 ...

  7. Java数据结构——二叉树节点的增删改查、获取深度及最大最小值

    一.查找最大值 // 查找最大值 public static Node maxNode() { Node node = root; Node maxNode = node; while (node ! ...

  8. 超市管理系统C语言

    登录系统 # include <stdio.h> //头文件 # include <string.h> //字符串头文件 # include <stdlib.h> ...

  9. C++字符串与指针

    字符串初始化 在C++中基本数据类型并不包括string,string类型其实是一种类类型,通过STL函数库中的模板类basic_string 实例化得到. int main () { // stri ...

  10. centos6.8上安装部署 jhipster-registry

    必备环境:jdk8,git,maven 1.安装nodejs #由于采用编译的方式很容易出现一些意外的惊喜,所以我们这儿直接用yum命令安装 #1.查看nodejs版本(命令中不要加 -y 如果版本不 ...