js中模拟移动端长按效果
我们都知道 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中模拟移动端长按效果的更多相关文章
- 【转】js 中导出excel 较长数字串会变为科学计数法
[转]js 中导出excel 较长数字串会变成科学计数法 在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串 ...
- js 中导出excel 较长数字串会变成科学计数法
在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串转换成 科学计数法.现在网上找到解决方案之一: (在数字串 ...
- js 中导出excel 较长数字串会变成科学计数法(转载)
在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串转换成 科学计数法.现在网上找到解决方案之一: (在数字串 ...
- 在JS中模拟表单的post提交,进行页面的跳转
原文链接:https://blog.csdn.net/jal517486222/article/details/83147761 /* *功能: 模拟form表单的提交 *参数: URL 跳转地址 P ...
- js中网页图片自动更换的效果
<script> var arr=new Array(); arr[]="url(images/city.jpg)"; arr[]="url(images/d ...
- JS中关于 一个关于计时器功能效果的实现
optionSearch(); function optionSearch() { //定义一个清除计时器的变量 var timer = null; //自选标题区域 $("#optiona ...
- js中模拟a标签的点击事件
var a = document.createElement('a'); a.target = "_blank"; a.href = "personal"; a ...
- JS 中的自定义事件和模拟事件
在 JS 中模拟事件指的是模拟 JS 中定义的一些事件,例如点击事件,键盘事件等. 自定义事件指的是创建一个自定义的,JS 中之前没有的事件. 接下来分别说一下创建这两种事件的方法. 创建自定义事件 ...
- 谈一谈原生JS中的【面向对象思想】
[重点提前说:面向对象的思想很重要!] 最近开始接触学习后台的PHP语言,在接触到PHP中的面向对象相关思想之后,突然想到之前曾接触的JS中的面向对象思想,无奈记性太差, ...
随机推荐
- Tun/Tap接口使用指导
Tun/Tap接口指导 目录 Tun/Tap接口指导 概述 工作机制 创建接口 举例 简单的程序 隧道 拓展 参考 概述 对tun接口的了解需求主要来自于openshift的网络,在openshift ...
- SpringSecurity权限管理系统实战—一、项目简介和开发环境准备
目录 SpringSecurity权限管理系统实战-一.项目简介和开发环境准备 SpringSecurity权限管理系统实战-二.日志.接口文档等实现 SpringSecurity权限管理系统实战-三 ...
- leetcode刷题记录——链表
使用java实现链表 单向链表 双向链表 单向循环链表 双向循环链表 题目记录 160.相交链表 例如以下示例中 A 和 B 两个链表相交于 c1: A: a1 → a2 c1 → c2 → c3 B ...
- Scala中的Map集合
1. Map集合 1.1 Scala中的Map介绍 Scala中的Map 和Java类似,也是一个散列表,它存储的内容也是键值对(key-value)映射,Scala中不可变的Map是有序的,可变的M ...
- centos7下的redis集群模式
1.先安装好单机版的redis 2.Reids安装包里有个集群工具,要复制到/usr/local/bin里去 cd /home/redis/redis-4.0./src ls - cp redis-t ...
- vue+leaflet
1.index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- Excel提取身份证出生日期②
问题场景 从user表中的身份信息中提取用户的出生日期: 以下方法也可适用于提取其他数据,不仅是身份证信息: 以下图中数据都为测试数据,不具备真实性! 场景一 user表中的18位身份证,提取出生日期 ...
- 理解Django 中Call Stack 机制的小Demo
1.工作流程 request/response模式下,request并不是直接到达view方法,view方法也不是将返回的response直接发送给浏览器的,而是request由外到里的层层通过各种m ...
- 《神经网络的梯度推导与代码验证》之FNN(DNN)的前向传播和反向推导
在<神经网络的梯度推导与代码验证>之数学基础篇:矩阵微分与求导中,我们总结了一些用于推导神经网络反向梯度求导的重要的数学技巧.此外,通过一个简单的demo,我们初步了解了使用矩阵求导来批量 ...
- NGUI 优化
1. Update Ngui 组件继承关系是 UIWidget : UIRect : MonoBehaviour. 因此由每个组件的独自调用update变更为,由某个更新点,统一调用会效率提升.并且 ...