苹果设备移动端点击无效click失效的解决办法

最新推荐文章于 2021-10-07 21:36:50 发布
原创 最新推荐文章于 2021-10-07 21:36:50 发布 · 9k 阅读 · 4 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文探讨了在iOS设备上使用jQuery的click事件时遇到的问题，即点击事件无法触发。文章指出，这是因为iOS设备默认使用touch事件而非click事件。通过为元素添加CSS样式cursor:pointer;，可以使div等元素在iOS上响应click事件。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

	$ (document).on('click','.gift-right',function(e){
		alert('发现点击无效');
	})

以上代码在电脑浏览器和安卓上都能触发alert事件，但是在ios上却完全没有反应
查阅了很多信息后，说是iphone这些元素上没有click事件，它是touch事件，
就是说如果这个name标签是button的可click事件则是可以触发的，因为div本身默认不可点击
解决方法是给这个元素添加css
.gift-right{
cursor:pointer;
}
这样是可以解决的

移动端热点问题
MingL520的博客
05-31 598
像素，又称画素，是图像显示的基本单位，译自英文“pixel”，pix是英语单词picture的常用简写，加上英语单词“元素”element，就得到pixel，故“像素”表示“图像元素”之意，有时亦被称为pel(picture element)像素是网页布局的基础。一个像素就是计算机能够显示一种特定颜色的最小区域。当设备尺寸相同但像素变得更密集时，屏幕能显示的画面的过渡更细致，网站看起来更明快。//ppi是指屏幕上每英寸可以显示的像素点的数量，即屏幕像素密度。
关于jquery中on绑定click事件在苹果手机失效的问题
热门推荐
北地程序星域※巨猿星
06-08 2万+
用一个div当做了一个按钮来使用。<div class="button"> <div class=" next_button button_left btn_red" style="width: 345px;"> 下一步 </div> </div>因为是动态添加的内容，所以想要使用click事件，需要给他用on绑定一下：$(document).on("click",".nex
ios中click不起作用
Null_Bugs的博客
11-07 605
click事件在PC端和安卓上都可以点击，但是在ios上 因为在ios上类名为click-btn的div元素上没有click事件，它是touch事件,如果把click-btn的div改成button,在ios上是可以点击的,div本身默认不能点击，解决方案如下： 方案1：在样式中添加属性cursor:pointer; 方案2：添加touchstart事件document.body.addEv...
IOS下的 click 点击失效
weixin_30687587的博客
04-02 203
当委托给一个元素添加click事件时，如果事件是委托到document或body上，并且委托的元素是默认不可点击的(如 div, span 等)，此时 click 事件会失效。 demo: <!DOCTYPE html> <html lang="en"> <head> <title></title&...
ios click事件失效
lylongqq的博客
09-08 630
当使用委托给一个元素添加click事件时，如果事件是委托到document或body上，并且委托的元素是默认不可点击的（如 div, span 等），此时 click 事件会失效。 解决办法有 4 种可供选择：  ​1、将 click 事件直接绑定到目标​元素（​​即 .target）上 2、将目标​元素换成 或者button等可点击的​元素 ​3、将 click 事件委托到​​​​​非
$(document).click() 在IOS上不触发事件解决方法
wisdomLee_CN的博客
11-27 2041
click事件和 touchstart事件共存 安卓IOS手机都适用 $(document).on("click touchstart", ".demo", function() { alert("demo"); }); 如：touchstart   这个事件不好用  给 class为  demo的div  添加  个css：cursor:pointer ；...
解决 - vue移动端项目在IOS上点击输入框失效， 需要点击多次
sunshime的博客
07-19 1143
  近期发现项目中关于输入框在ios上点击失效，多次点击才可以获取焦点的问题， 一、导致这个问题发生的原因 &emsp;&emsp;是因为我在这个项目种使用了 FastClick ，它的作用是解决移动端延迟300毫秒的问题。   当使用FastClick 时，在ios上点击输入框，调取手机自带输入键盘不灵敏，有时候甚至点不出来。而安卓上完全没问题。这个原因是因为FastClick的点击穿透。 二、解决方法   修改一下 FastClick 的使用代码，如下： FastClick.proto
常见的移动端H5页面开发遇到的坑和解决办法
qq_35859392的博客
04-17 990
转过来，平时看看。虽然还有很多问题至今无解。比如：华为麒麟950的P8和meta打开我们的应用首页经常偶发白屏。！！ 1、安卓浏览器看背景图片，有些设备会模糊。 用同等比例的图片在PC机上很清楚，但是手机上很模糊，原因是什么呢？ 经过研究，是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone 4的9...
总结40条常见的移动端Web页面问题及解决方案
weixin_36106791的博客
08-17 650
前言 工作中接手做过一些移动端的项目，在开发过程中，发现了一些问题，结合网友的一些经验总结，整理下移动端常见的问题，这是在前一篇基础上，整理网友的经验，希望对大家有用。 1.安卓浏览器看背景图片，有些设备会模糊。 用同等比例的图片在PC机上很清楚，但是手机上很模糊，原因是什么呢？ 经过研究，是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把 iPhone 4的960640分辨率，在网页里只显示了480320，这样devicePixelRat
解决iOS下无法触发focus事件的问题
08-27
在移动端开发中， focus 事件是一个非常重要的事件，它可以帮助开发者更好地控制用户的输入行为。但是在iOS平台上，触发 focus 事件却是一个非常棘手的问题。本文将为大家分享解决iOS下无法触发focus事件的问题，并...
移动端ios系统click事件失效
小考拉的博客
10-07 1229
移动端写click事件的时候，发现有时候会在ios失效，点击没有反应。 解决方案：把需要写click事件的部分，元素改成a或者button，然后绑定click事件
click在手机端不响应问题
weixin_30242907的博客
08-23 1051
click事件在手机端有延迟，所以会有不响应问题 解决方法有二： 1.fastclick.js 　　a.引入<script src="~/Scripts/fastclick.js"></script> 　　b.实例化FastClick.attach(document.body); 　　c.直接绑定click事件即可 　　这里很可能报错：unable to pr...
ios系统多次点击onclick事件失效问题
m0_37983475的博客
01-16 956
/*ios系统多次点击图片，只有最后一次点击后才触发jump*/ <img src="" onclick="jump()" class="pop"> 一开始以为是系统延迟，网络问题，后来发现是ios系统的原因。 解决方法： function jump(){ window.location.href = "https://www.jianshu.com/p/dc9144e37ade" ...
关于iphone手机上点击事件不起作用
qq_36371276的博客
08-15 2480
今天调试手机端H5页面的时候，发现一个很坑的问题，绑定的点击事件不起效果，安卓上都没问题，事件能正确触发，但是在iPhone没反应。 　　开始觉得是写法问题，后来发现，是由于iPhone上，点击的对象，必须加上一个样式，拥有cursor:pointer这个样式，就没问题了。 　　兼容性的问题，比较坑，需要慢慢积累，以后遇到解决起来就快了。 成功，唯有积累，没有奇迹！
$(document).click() 在苹果手机上不能正常运行解决方案
qq_26642611的博客
03-12 567
$(document).click() 在苹果手机上不能正常运行解决方案 本来是如下一段跳转代码，发现在安卓和微信开发者工具上都能正常运行，但是苹果手机就不行了。 $(document).on('click', '.url', function(){ location.href = $(this).attr('data-url'); return false; }); 经过查找资料发现，苹果的需要在click后面加上touchstart $(document).on('click tou
Jquery的$(document).click() 在iphone手机上失效的问题
Hello博客
05-15 1693
当一个div用来做按钮点击事件 <div class="login">登录</div> <script> $(document).on("click",".login",function(){ alert('login'); }); </script> 就是这样一个点击事件在iPhone手机上是无效的，查阅资料说是div自身没有点击事...
移动端click失效的问题
听闻青春丶
01-05 6057
解决办法有 5种可供选择： ​1、将 click 事件直接绑定到目标​元素（​​即 .target）上 2、将目标​元素换成 a 或者 button 等可点击的​元素 ​3、将 click 事件委托到​​​​​非 document 或 body 的​​父级元素上 ​4、给​目标元素加一条样式规则 cursor: pointer; ​5、 $.each($(".pt_ARL_box_aside...
IOS - Safari中click点击事件无效
weixin_30660027的博客
12-02 280
做web移动端页面时，安卓端一点问题也没，发现在ios真机上点击事件无效，发现Safari下只有默认可点击的元素才click点击事件，像span div等元素是不具有点击事件的。 解决问题四种方式： 　　1.将 click 事件直接绑定到目标元素（即 .target）上 　　2.将 click 事件委托到非 document 或 body 的父级元素上 　　3.将目标元素换成 <a&...
vue 移动端 click事件失效问题
m0_56026872的博客
07-15 1667
vue 移动端 click事件失效问题 今天在写项目时遇到了一个狗血又令人头痛的问题，我的点击事件突然之间就不顶用了，但是因为我写的是移动端的项目，我把浏览器运行环境切换到pc端去做了一下尝试，发现这奇葩的点击时间又可以了，怎么搞，搞个锤子，一通百度猛如虎，心情如下 经过半个小时的垂死挣扎，我突然间想起来自己使用了一个滚动插件better-scroll，会不会是他的问题呢，去看看官方文档怎么说吧，发现了这个问题 问题找到了，那就上代码，哦了 this.scroll = new BetterScroll(t
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值