1.问题描述

用amazeUI做了个手机端网站,网站头部是一个点击按钮下拉菜单,点击页面其余区域下拉菜单隐藏。在chrome模拟安卓和iOS都可以正常触发,但是在真机实测的时候,iOS上面失效了。简单代码描述如下

    $(document).on("click", function (e) {
$("#collapse-head").css("display", "none")
});

function里面的代码不会执行。

2.解决

查阅信息后,说是iphone这些元素上没有click事件,它是touch事件

(1)有一个解决方法是给需要绑定事件的元素添加一个css cursor: pointer 。 
body{ 
cursor:pointer; 
}

(2)或者将click改为touchstart事件,或者共存

  

$(document).on(“click touchstart”, “.name”, function() {
$("#collapse-head").css("display", "none")
});

ios手机访问H5页面中$(document).on绑定无效问题的更多相关文章

  1. vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题

    异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...

  2. robotframework_如何用Chrome模拟手机打开H5页面

    由于公司目前的产品大部分都是APP端的H5页面,APP原生页面很少,测试H5页面如果去搭建appium或者macaca这类自动化平台太费时,太重而不能快速落地:与自动化的目标:提高测试效率相悖.但如果 ...

  3. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

  4. 前端:微信支付和支付宝支付在pc端和h5页面中的应用

    1:h5微信支付 使用的是https://pay.weixin.qq.com/wiki/doc/api/index.html  中的 (1):公司需要首先要配置公众号微信支付地址和测试白名单(支付的时 ...

  5. iOS bug 之 H5 页面没有弹出提示框

    描述:在安卓上有提示框,但是在iOS上没有提示框. step 1: 失误,是我没有在正确的位置设置网址. step 2: 修改之后,测试页能弹出提示框,但是正式的页面没有提示框. step 3: 我输 ...

  6. 手机app/h5页面http请求抓包调试

    1.抓包机器跟客户端手机连上同一wifi热点,最好是第三者提供的移动wifi,公司内网wifi网络访问有限制. 2.设置手机客户端http代理 三者关系图示:

  7. iOS设备 微信h5页面回退 内容不刷新的问题

    原因分析: 一.android 浏览器 包括微信的开发者工具 都是ok的返回可以刷新页面但是唯有iOS不行. 二.iOS 浏览器原因:history.go(-1)返回上一页后,页面内容并不会刷新.在B ...

  8. 用sublime server 启动本地服务器(手机访问电脑页面)

    安装sublime server 插件包           1.Ctrl + shift + p                      install package               ...

  9. 关于ios手机游览器针对overflow:hidden设置无效的解决办法

    Ordinarily, overflow: hidden; on the body tag is sufficient to prevent scrolling a web page, if for ...

随机推荐

  1. 使用Portainer管理Docker

    Portainer Portainer安装非常简单,只需不到一分钟.Portainer完全支持Docker 1.10及更高版本. Mac 快速安装运行: 命令行输入: docker pull port ...

  2. Dlib Python 检测人脸特征点 Face Landmark Detection

    首先安装Dlib,Opencv库 Dlib安装链接:http://www.cnblogs.com/as3asddd/p/7237280.html 环境:Mac Sierra 10.12.1 Pytho ...

  3. Re.多项式求逆

    前言 emmm暂无 多项式求逆目的 顾名思义 就是求出一个多项式的摸xn时的逆 给定一个多项式F(x),请求出一个多项式G(x),满足F(x)∗G(x)≡1(modxn),系数对998244353取模 ...

  4. ADC采样工作原理详解

    如何利用单片机的ADC模块(或者独立的ADC芯片)得到接入ADC管脚上的实际电压值?这个问题,是第一次接触ADC时候,大家都会遇到的问题.会读到什么值单片机会读到什么值?需要看一个特性,就是几位的AD ...

  5. SQLServer版本

  6. JavaScript千分符---正则实现

    一般在JavaScript中实现千分符,是使用切割+连接一顿操作 这里尝试一下使用正则快速实现千分符 let num0 = '12' let num1 = '123' let num2 = '1234 ...

  7. C语言博客作业06——结构体&文件

    C语言博客作业06--结构体&文件 1.本章学习总结 1.1思维导图 1.2.本章学习体会 在本周的学习中,我们学习了关于结构体和文件的内容.结构体的本身并不难,但以结构体为基础的链表还是让我 ...

  8. python3 动态import

    有些情况下,需要动态的替换引入的包 1.常用的import方法 import platform import os 2.__import__ 动态引用 loop_manager = __import_ ...

  9. 002 网上看的unity学习路线

  10. Tomcat系列(8)——Tomcat运行模式连接数和线程池

    Connector的主要功能,是接收连接请求,创建Request和Response对象用于和请求端交换数据:然后分配线程让Engine(也就是Servlet容器)来处理这个请求,并把产生的Reques ...