识别长按

最近微信新增了一个功能:长按识别验证码。

原理是这样的:检测长按事件---触发-->截取图片中的验证码

关于长按,我们可以这么处理:

1,点击开始时(onMouseDown||onTouchStart)触发时一个timer,并设定时间

2,点击结束时(onMouseUp || onTouchEnd) 清除这个定时任务,若开始于结束中间的时间不满足timer的时间,那么实际上就不会触发事件,从而达到了长按的效果

如代码

 1 var canvas = document.getElementById(‘myCanvas‘);
 2 var timer = null;
 3
 4 ?canvas.onmousedown = function(){
 5   timer = setTimeout( doStuff, 2000 );
 6 };
 7
 8 canvas.onmouseup = function(){
 9   clearTimeout( timer );
10 };
11
12 function doStuff() {
13   alert(‘hello, you just pressed the mousebutton for two seconds.‘)
14 }

Demo

接着利用ZXing或是ZBar,判断图片中是否包含二维码

时间: 2025-01-02 15:04:25

识别长按的相关文章

STM8S---外部中断应用之长按键识别

STM8常用中断指令 开总中断 _asm("rim"); 禁止中断 _asm("sim"); 进入停机模式 _asm("halt"); 中断返回 _asm("iret"); 等待中断 _asm("wfi"); 软件中断 _asm("trap"); STM8S常用中断映射 如使用中断函数时,可以通过在上图中查找相对应的中断向量号,而中断函数的名字可以自定义 /* BASIC INTERRU

文档识别

中安私有云文档识别是基于业界领先的OCR引擎,可针对文档照片进行识别,并返回结构化结果. ? 简单--企业可将该识别服务部署在自有服务器上(云服务器或本地服务器) ? 部署--识别率高,单张识别速度快 ? 方便--该识别服务更新维护方便,企业可自行进行更新维护 ? 通用--支持APP.客户端.浏览器.微信端.扫描仪.高拍仪等多种途径调用识别 ? 平台--支持Windows(32/64).Linux(32/64)主流服务器系统 ? 全面--可支持普通文档识别.自然场景文字识别.长微博识别.图片彩页

移动端兼容性问题解决方案

1. IOS移动端click事件300ms的延迟响应 移动设备上的web网页是有300ms延迟的,玩玩会造成按钮点击延迟甚至是点击失效.这是由于区分单击事件和双击屏幕缩放的历史原因造成的, 2007年苹果发布首款iphone上IOS系统搭载的safari为了将适用于PC端上大屏幕的网页能比较好的展示在手机端上,使用了双击缩放(double tap to zoom)的方案,比如你在手机上用浏览器打开一个PC上的网页,你可能在看到页面内容虽然可以撑满整个屏幕,但是字体.图片都很小看不清,此时可以快速

ios和android适配

一些情况下对非可点击元素如(label,span)监听click事件,ios下不会触发 解决方案:css增加cursor:pointer; 三星手机遮罩层下的input.select.a等元素可以被点击和focus(点击穿透) 问题发现于三星手机,这个在特定需求下才会有,因此如果没有类似问题的可以不看.首先需求是浮层操作,在三星上被遮罩的元素依然可以获取focus.click.change),有两种解决方案: 1.是通过层显示以后加入对应的class名控制,截断显示层下方可获取焦点元素的事件获取

移动端兼容问题注意事项

1. IOS移动端click事件300ms的延迟响应 移动设备上的web网页有300ms延迟,有时会造成按钮点击延迟或者点击失效. 苹果为了将适用于PC端大屏幕的网页能较好的展示在手机端上,使用了双击缩放(double tap to zoom)的方案,发布IOS系统搭载的safari.如:在手机上用浏览器打开一个PC的网页,你可能在看到页面内容虽然可以撑满整个屏幕,但是字体.图片都很小看不清,此时可以快速双击屏幕上的某一部分,你就能看清该部分放大后的内容,再次双击后能回到原始状态. 双击缩放:用

Anti-alias的前世今生

原文: http://www.cnblogs.com/gongminmin/archive/2011/05/16/2047506.html Anti-alias,简称AA,在图形学中广泛地用于提升渲染质量.经过几十年的发展,AA也从离线渲染逐步普及到了实时渲染的领域.本系列文章将总结一下在实时渲染中使用的AA方法的前世和今生.本片集中讨论硬件提供的AA方法. 图1. 一个像素内部的采样点.16个红圈表示16个采样点,蓝色和黄色是覆盖了这个像素的两个三角形. SSAA Super Sampling

移动端问题汇总

问题列表 伪类 :active 生效 要CSS伪类 :active 生效,只需要给 document 绑定 touchstart 或 touchend 事件 <style> a { color: #000; } a:active { color: #fff; } </style> <a herf=foo >bar</a> <script> document.addEventListener('touchstart',function(){},fa

移动端遇到的问题

https://github.com/AlloyTeam/Mars https://github.com/hoosin/mobile-web-favorites 跨域问题 手机浏览器也是浏览器,在ajax调用外部api的时候也存在跨域问题,这时候可以让后端加上两个http头 Access-Control-Allow-Origin "*" Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type,

Gesture Recognizers与触摸事件分发

一.Gesture Recognizers Gesture Recognizers是在iOS3.2引入的,可以用来识别手势.简化定制视图事件处理的对象.Gesture Recognizers的基类为UIGestureRecognizer,这一个抽象基类,定义了实现底层手势识别行为的编程接口.在UIKit框架中提供了6个具体的手势识别类,用来识别常见的手势.这6个手势识别器类为: UITapGestureRecognizer:用来识别点击手势,包括单击,双击,甚至三击等. UIPinchGestu