移动端ajax,jQuery基于$.ajax设置移动端click超时处理方法

本文实例讲述了jQuery基于$.ajax设置移动端click超时处理方法。分享给大家供大家参考,具体如下:

这里介绍jquery click事件如何在移动端自动转换成touchstart事件。

因为移动端click事件会比touchstart事件慢几拍

移动设备某个元素上事件执行顺序是:

touchstart

touchmove

touchend

click{mousedown->mousemove->mouseup}

click事件在移动设备上虽然会识别但却是最后一个执行的,所以如果不把click事件换成touchstart事件的话,就可能造成延时导致交互上也慢了几拍

所以在移动端最好把click事件换成touchstart事件。

那么如何添加事件比较简单呢.

于是乎有了以下这种写法:

var handle = function (e) {

e.preventDefault(); // 阻止浏览器默认行为

alert('fuck world');

}

$('body').on('touchstart mousedown', handle );

这样在pc端浏览器上面alert只执行一次,触发的事件是mousedown

在ios设备safari浏览器上面alert也只执行一次,触发的事件是touchstart

为什么只执行一次?

秘密在于当执行的是touchstart后,preventDefault掉了后面的click就不执行了,“非常完美”.

^_^! 一如既往的android设备蛋疼是必须的,测试发现除qq浏览器外其它浏览器都会alert两次

也就是说touchstart和mousedown的handle函数都执行了, 似乎是e.preventDefault()没有起作用。具体原因不明...

因为要兼容,所以就没办法了只能通过判断是否支持touch事件来分别添加事件了..

那就扩展一个jquery方法插件吧仿一个on方法的插件方法比如名称为quickOn,(如果你连on方法怎么用都不知道,那你就走吧,离开这里...)

;(function(){

var isTouch = ('ontouchstart' in document.documentElement) ? 'touchstart' : 'click';

if(!$.fn.quickOn){

$.fn.quickOn= function(){

arguments[0] = (arguments[0] === 'click') ? isTouch: arguments[0];

return $.fn.on.apply(this, arguments);

};

}

})();

quickOn虽然名字尴尬了一点,但是能用,例如:

$('body').quickOn('click', function(){

alert('fuck world') ;

})

额。。后来想想,为什么不直接重载jquery的on方法呢??

来吧,试试

;(function(){

var isTouch = ('ontouchstart' in document.documentElement) ? 'touchstart' : 'click', _on = $.fn.on;

$.fn.on = function(){

arguments[0] = (arguments[0] === 'click') ? isTouch: arguments[0];

return _on.apply(this, arguments);

};

})();

希望本文所述对大家jQuery程序设计有所帮助。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/351244.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python单例模式的4种实现方法

[python] view plaincopy #-*- encodingutf-8 -*- print ----------------------方法1-------------------------- #方法1,实现__new__方法 #并在将一个类的实例绑定到类变量_instance上, #如果cls._instance为None说明该类还没有实例化过,实例化该类,并返回 #如果cl…

java虚拟机-程序计数器PC Register

什么是程序计数器? 程序计数器是一块 较小 的内存空间,它可以看做是当前线程所执行的字节码的 行号指示器 ;在虚拟机的概念模型里(仅仅是概念模型,各种虚拟机可能会通过一些更高效的方式去实现)&#xff0c…

织梦ajax表单提交参数错误,【织梦二次开发】织梦jquery+ajax方式提交自定义表单...

我们在dedecms教程中学到很多,比如可以借助jquery ajax提交dedecms自定义表单到后台。此例只做为参考,实际项目中根据自己的情况酌情修改。html部分:姓名:电话:留言:js部分:function send(){$.a…

R-Tree空间索引算法的研究历程和最新进展分析

摘要:本文介绍了空间索引的概念、R-Tree数据结构和R-Tree空间索引的算法描述,并从R-Tree索引技术的优缺点对R-Tree的改进结构——变种R-Tree进行了论述。最后,对R-Tree的最新研究进展进行了分析。 关键词:空间索引技术&#xff1b…

Git同时使用不同平台代码仓库

问题描述 公司项目使用代码仓库为gitinn/gitlab等,个人项目使用github进行托管,而公司项目和个人项目设置的邮箱和用户名是不同的,而ssh的密钥对又是基于这两个信息生成的,所以此时想要同时使用两个平台的代码仓库,则会…

java签署ssl_签署Java代码

java签署ssl在上一篇文章中,我们讨论了如何保护移动代码 。 提到的措施之一是签名代码。 这篇文章探讨了Java程序如何工作。 数字签名 数字签名的基础是密码学 ,特别是公钥密码学 。 我们使用一组加密密钥:私有密钥和公共密钥。 私钥用于…

服务器中有两个R文件夹,一台服务器中配置多个git sshkey

需求背景:GitHub上有两个项目,需要拉取到同一台服务器,并且都需要通过ssh的方式拉取假设两个项目分别叫: proj1 和 proj2一、分别生成 ssh key# 先生成 proj1 的 sshkey$ ssh-keygen -t rsa -C "888888qq.com"image.png…

1-26HashSet简介

Set的特点 Set里面存储的元素不能重复,没有索引,存取顺序不一致。 package com.monkey1024.set;import java.util.HashSet;/*** Set的特点:元素不能重复,没有索引,存取顺序不一致**/ public class HashSetTest01 {publ…

C++ 异常 与 ”为什么析构函数不能抛出异常“ 问题

C 用异常使得可以将正常执行代码和出错处理区别开来。 比如一个栈,其为空时,调用其一个pop 函数,接下来怎么办? 栈本身并不知道该如何处理,需要通知给其调用者(caller),因为只有调用…

适用于Java开发人员的Groovy吗? 认识Gradle,Grails和Spock

Java开发人员最感兴趣的Groovy用例有哪些? 尽管已经存在了一段时间,但是似乎只有Groovy最近才开始使用Groove。 对于某些人来说,它基本上只是另一种深奥的JVM语言,但是由于一些流行的工具可以帮助您使用Java,因此它比…

批量获取服务器cpu信息,获取服务器的cpu利用率

你得到的错误是什么?这就是我正在使用同样的东西(剥离了一下)。它显示每物理处理器的负载。strComputer "."Dim arrProcessors : ReDim arrProcessors(2,0)Set objWMIService GetObject("winmgmts:" _& "{impersonationLevelimperso…

CEPH FILESYSTEM

参考文档: CEPH FILESYSTEM:http://docs.ceph.com/docs/master/cephfs/ CephFS best practices:http://docs.ceph.com/docs/master/cephfs/best-practices/ MDS STAT:http://docs.ceph.com/docs/master/cephfs/mds-states/ Mount …

条款11 在operator=中处理“自我赋值”

“自我赋值”发生在对象被赋值给自己时: 1 classWidget {...}; 2 Widget w; 3 ... 4 w w; //赋值给自己这看起来有点愚蠢,但它合法,所以不要认定客户绝不会那么做。此外赋值动作并不总是那么可被一眼辨认出来,例如: a[…

定时器实现方式之TimerTask、Timer

在未来某个指定的时间点或者经过一段时间延迟后执行某个事件,这时候就需要用到定时器了。定时器的实现方式有很多种,今天总结最简单的实现方式。java 1.3引入了定时器框架,用于在定时器上下文中控制线程的执行,其由类Timer和Timer…

jaxb 处理_休息使用Jersey –包含JAXB,异常处理和客户端程序的完整教程

jaxb 处理最近,我开始使用Jersey API开发一个Restful Web服务项目。 在线提供了一些教程,但是我遇到了异常处理方面的一些问题,而且在使用JaxB并提供异常处理方法的完整项目中找不到任何地方。 因此,一旦我能够使用带有异常处理和…

并查集(UnionFindSet)

小米的校招题:朋友圈(25分)假如已知有n个人和m对好友关系(存于数字r)。如果两个人是直接或间接的好友(好友的好友的好友...),则认为他们属于同一个朋友圈,请写程序求出这…

Spring Boot配置文件放在jar外部

https://www.cnblogs.com/xiaoqi/p/6955288.html 在当前目录创建文件夹config,把配置文件放到config目录,然后启动 java -jar export.jar --spring.config.locationconfig/config.properties转载于:https://www.cnblogs.com/Andrew520/p/10491927.html

Apache Camel Intellij IDEA插件的工作已开始

仅仅因为圣诞节并不意味着骆驼停滞不前。 在23日晚上,我花了一些时间进行研究,并开始研究IDEA的Apache Camel插件的小原型。 它已经存在了很长时间。 原因是Apache Camel为目录提供了有关工具的大量有用信息。 该目录包含有关每个Camel组件&#xff0c…

Python函数参数传递:传值还是传引用

引子 首先来看一个列子: def change(val):val.append(100)val [T, Z, Y] nums [0, 1] change(nums) print(nums)123456123456 猜猜结果应该是什么? 如果Python函数参数的传递是传值的话,结果应该是[0, 1],如果是传引用的话&am…

activitemq与spring的整合

activitemq整合spring 一.activmq的点对点模型 pom.xml: <?xml version"1.0" encoding"UTF-8"?><project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLoca…