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. Linux学习之路3-HelloWorld

    1.window系统上创建helloworld.c文件,并编写程序 #include <stdio.h> main(){ printf("Hello World!"); ...

  2. Azure Function & AWS Function With C#

    Using C# with Azure Functions Two important prerequisites need to be met to build Azure Functions ap ...

  3. Ubuntu命令整理

    linux下find命令的使用和总结 - CS408 - 博客园 ubuntu 命令简写和全称 su:Swith user  切换用户,切换到root用户 cat: Concatenate  串联 u ...

  4. 图像风格迁移(Pytorch)

    图像风格迁移 最后要生成的图片是怎样的是难以想象的,所以朴素的监督学习方法可能不会生效, Content Loss 根据输入图片和输出图片的像素差别可以比较损失 \(l_{content} = \fr ...

  5. Java复习总结——String

    概览 String被声明为final,因此它不可被继承. public final class String implements java.io.Serializable, Comparable&l ...

  6. (转)Java回收对象的标记 和 对象的二次标记过程

    Java回收对象的标记 和 对象的二次标记过程 二次标记 针对这个问题,虚拟机的做法是进行两次标记,即第一次标记不在“关系网”中的对象.第二次的话就要先判断该对象有没有实现finalize()方法了, ...

  7. ORACLE创建表空间 新建用户 授权

    --建表空间create tablespace <用户> datafile 'D:\oradatadev\<用户>.dbf' size 200mautoextend on ne ...

  8. Css(常用的特殊效果)

    一.前言 不得不说css真强大,总结了几个常用的css特殊效果 二.主要内容 1.几个特殊效果 $green = #02a774; $yellow = #F5A100; $bc = #e4e4e4; ...

  9. Django web编程3 -- 创建用户账户

    我们将建立一个用户注册和身份验证系统,让用户能够注册账户,进而登录和注销.我们将创建一个新的应用程序,其中包含与处理用户账户相关的所有功能.我们还将对模型Topic 稍做修改,让每个主题都归属于特定用 ...

  10. Python认识到放弃

    基础入门 计算机硬件基础 变量 数据类型 基本运算符 变量常量 流程控制 数据类型 数字,字符串,列表 元组,字典,集合 字符编码 python2 python3 文件处理 文件读写 指针移动 函数 ...