2.

默认的监听方式

document.addEventListener('touchstart', function(){ alert('hello'); }, false);

使用jquery时

$(document).on('touchstart', function(e){
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
});

2.我们常用:hover,:focus,:active等css伪类做按钮点击的反馈效果,可是这时在移动端开发时会遇到这样一个问题,伪类状态没有反应 pc端ok, 安卓上ok,可遇到iPhone设备就不行了

1] By default, Safari Mobile does not use the :active state unless there is a touchstart event handler on the relevant element or on the <body>
在iOS系统的移动设备中,需要在按钮元素或body/html上绑定一个touchstart事件才能激活:active状态。

document.body.addEventListener('touchstart', function () { //...空函数即可});  

https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html

获得touch事件,jquery绑定事件监听器,ios设备上打开touch状态以响应focus,active等伪类的更多相关文章

  1. iPhone, Android等设备上的Touch和Gesture

    现在,为智能触摸手机创建直观的用户界面时,最重要的部分不再是单纯的视觉效果,而是要创建出能很好地处理用户触摸交互的界面.对于Web应用而言,这意味着使用touch事件来取代传统的mouse事件.在Do ...

  2. jQuery绑定事件的四種方式

    这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...

  3. jQuery绑定事件-多种方式实现

    jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...

  4. jQuery学习-事件之绑定事件(三)

    在上一篇<jQuery学习-事件之绑定事件(二)>我们了解了jQuery的dispatch方法,今天我们来学习下handlers 方法: handlers: function( event ...

  5. jQuery学习-事件之绑定事件(二)

    在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) {   ...

  6. jQuery绑定事件的on()

    jQuery绑定事件 语法:$(selector).on(event,childselector,function(){}); 可以为自身的加事件(一个或多个)  也可以为其子元素加事件(一个或多个) ...

  7. js进阶---12-10、jquery绑定事件和解绑事件是什么

    js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...

  8. Jquery绑定事件及动画效果

    Jquery绑定事件及动画效果 本文转载于:https://blog.csdn.net/Day_and_Night_2017/article/details/85799522 绑定事件 bind(ty ...

  9. 关于jquery绑定事件执行两次

    经常会出现jquery绑定事件执行两次的情况,如: $("a[tag=slide]").click(function () { alert(1); $(this).parent() ...

随机推荐

  1. php 多维数组相同键值处理合并

    一.前言 在实际情况中,有时需要针对多维数组相同键值作相应的处理(四则运算.比较大小等)后才能够使用到实际情况中,现给出三维数组(多维数组可相应拓展)任意多个相同键值处理的函数,以备查阅. 二.代码 ...

  2. Linux平台下安装MySQL

    1.下载RPM包 http://dev.mysql.com/downloads/mysql/5.5.html#downloads 选择[Red Hat & Oracle Enterprise ...

  3. ### Cause: java.lang.reflect.UndeclaredThrowableException

    ### Cause: java.lang.reflect.UndeclaredThrowableException Caused by: org.apache.ibatis.exceptions.Pe ...

  4. [CodeForces948B]Primal Sport(数论)

    Description 题目链接 Solution 设f(x)为x的最大质因子 那么由题意易得\(X_1\)的范围在\([X_2-f(X_2)+1,X2]\) 同理\(X_0\)的范围在\([X_1- ...

  5. 18式优雅你的Python

    本文来自读者梁云同学的投稿,公众号:Python与算法之美 一,优雅你的Jupyter 1,更改Jupyter Notebook初始工作路径 平凡方法: 在cmd中输入jupyter notebook ...

  6. python-7面向对象高级编程

    1-给类动态增加方法 class Student(object): pass def set_score(self, score): self.score = score Student.set_sc ...

  7. JS:关于JS字面量及其容易忽略的12个小问题

    简要 问题1:不能使用typeof判断一个null对象的数据类型 问题2:用双等号判断两个一样的变量,可能返回false 问题3:对于非十进制,如果超出了数值范围,则会报错 问题4:JS浮点数并不精确 ...

  8. luogu3317 [SDOI2014]重建

    原来矩阵树定理对于边是概率的情况也是适用的qwqwq. ref #include <iostream> #include <cstdio> #include <cmath ...

  9. Caliburn.Micro 消息附加多事件

    <Button Content="Let's Talk"cal:Message.Attach="[Event MouseEnter] = [Action Talk( ...

  10. 【Invert Binary Tree】cpp

    题目: Invert Binary Tree Total Accepted: 20346 Total Submissions: 57084My Submissions Question Solutio ...