app,其中有长按LI列表弹出菜单,只要清楚五个方法就行:ontouchstart、ontouchmove、ontouchend、setTimeout、clearTimeout

1、首先在我们按下手指时触发:ontouchstart

2、当我们释放手指时触发:ontouchend

3、如果在按与放之间你没有为其定义事件,那么系统自动认为是onclick事件

4、所以我们要在按与放之间定义一个事件longPress,这里就要用定时器setTimeout。

5、但如果在按与放之间有手指有移动,你不能认为它是长按,这应该是用户想滑动,所以ontouchmove时要取消定义的那个长按事件,这时就要取消定时器clearTimeout。

实例如下:如果用户在500毫秒内没有放开手指,也没有移动手指,则触发长按事件

    <div ontouchstart="gtouchstart()" ontouchmove="gtouchmove()" ontouchend="gtouchend()">长按我</div>
    var timeOutEvent=0;//定时器
//开始按
function gtouchstart(){
timeOutEvent = setTimeout("longPress()",500);//这里设置定时器,定义长按500毫秒触发长按事件,时间可以自己改,个人感觉500毫秒非常合适
return false;
};
//手释放,如果在500毫秒内就释放,则取消长按事件,此时可以执行onclick应该执行的事件
function gtouchend(){
clearTimeout(timeOutEvent);//清除定时器
if(timeOutEvent!=0){
//这里写要执行的内容(尤如onclick事件)
alert("你这是点击,不是长按");
}
return false;
};
//如果手指有移动,则取消所有事件,此时说明用户只是要移动而不是长按
function gtouchmove(){
clearTimeout(timeOutEvent);//清除定时器
timeOutEvent = 0;
}; //真正长按后应该执行的内容
function longPress(){
timeOutEvent = 0;
//执行长按要执行的内容,如弹出菜单
alert("长按事件触发发");
}

ios webview下纯JS实现长按的更多相关文章

  1. ios webview下footer部分fixed失效问题

    场景: 如下图所示,一个很正常的页面需求,footer固定在底部,中间为滚动内容区 然后footer的css一般是这样的 footer{ position:fixed; bottom:; left:; ...

  2. 在webView 中使用JS 调用 Android / IOS的函数 Function

    最近做一个项目,混合了NativeCode 和 HTML,为了便于JS 调用App的一些方法,统一封装一个Js方法,记录如下 Android 端首先要再WebView中允许JS的调用 WebView ...

  3. F2工作流引擎之-纯JS Web在线可拖拽的流程设计器(八)

          Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回.传阅.转交,都可以非常方便快捷地实现,管理员 ...

  4. 纯JS Web在线可拖拽的流程设计器

    F2工作流引擎之-纯JS Web在线可拖拽的流程设计器 Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回. ...

  5. iOS中UIWebView执行JS代码(UIWebView)

    iOS中UIWebView执行JS代码(UIWebView) 有时候iOS开发过程中使用 UIWebView 经常需要加载网页,但是网页中有很多明显的标记让人一眼就能看出来是加载的网页,而我们又不想被 ...

  6. 转载 【iOS开发】网页JS与OC交互(JavaScriptCore) OC ----->JS

      目标 本文介绍利用苹果在iOS7时发布的JavaScriptCore.framework框架进行js与OC的交互.我们想要达到的目标是: OC调用网页上的js方法 网页js调用APP中的OC方法 ...

  7. iOS Webview 实现修改javascript confirm 和 alert

    贴代码: @interface UIWebView (JavaScriptAlert) -(void) webView:(UIWebView *)sender runJavaScriptAlertPa ...

  8. 纯js异步无刷新请求(只支持IE)

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

  9. [分享黑科技]纯js突破localstorage存储上线,远程抓取图片,并转码base64保存本地,最终实现整个网站所有静态资源离线到用户手机效果却不依赖浏览器的缓存机制,单页应用最新黑科技

    好久没有写博客了,想到2年前答应要放出源代码的也没放出来,最近终于有空先把纯js实现无限空间大小的本地存储的功能开源了,项目地址https://github.com/xueduany/localsto ...

随机推荐

  1. jQuery .on() and .off() 命名空间

    jQuery .on() and .off() 命名空间 博客分类: 生活 前端开发   jQuery1.7开始,jQuery引入了全新的事件绑定机制,jQuery .on() 和 off() 两个函 ...

  2. LeetCode(30):与所有单词相关联的字串

    Hard! 题目描述: 给定一个字符串 s 和一些长度相同的单词 words.在 s 中找出可以恰好串联 words 中所有单词的子串的起始位置. 注意子串要与 words 中的单词完全匹配,中间不能 ...

  3. 在django中使用FormView,success_url死活不能生效的问题

    真的不知道是怎么回事, 以前都是手动的, form使用modelform. view使用createview. 今天写新系统时,为了更灵活. form使用form,(这样一来,可以在form是随便按数 ...

  4. 行为型模式之Command模式

    命令模式将一个请求封装成一个对象,从而让你使用不同的请求把客户端参数化, 并且可以对请求排队或者记录请求日志,可以提供命令的撤销和恢复功能. 概念描述 把命令的调用者与执行者分开,使双方不必关心对方是 ...

  5. asp.net core 微信公众号支付(扫码支付,H5支付,公众号支付,app支付)之3

    在微信公众号中访问手机网站,当需要调用支付时候无法使用H5支付,只有使用微信公众号支付,使用公众号支付用户必须关注该公众号同时该公众号必须开通公众号支付功能. 1.获取用户的OpenId ,参考之前写 ...

  6. python导包踩过的坑之包名和模块名同名

  7. Codeforces 160D Edges in MST tarjan找桥

    Edges in MST 在用克鲁斯卡尔求MST的时候, 每个权值的边分为一类, 然后将每类的图建出来, 那些桥就是必须有的, 不是桥就不是必须有. #include<bits/stdc++.h ...

  8. gitlab发送邮件

    1.修改配置文件,建议使用企业邮箱 #vim /etc/gitlab/gitlab.rb gitlab_rails['smtp_enable'] = true gitlab_rails['smtp_a ...

  9. BZOJ5120 [2017国家集训队测试]无限之环 费用流

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ5120 题意概括 原题挺简略的. 题解 本题好难. 听了任轩笛大佬<国家队神犇>的讲课才 ...

  10. 浮点数在计算机中的表示(IEEE浮点数标准)

    转载自:https://wdxtub.com/2016/04/16/thin-csapp-1/