jquery绑定click事件，在ios7 8下不触发的bug

最新推荐文章于 2022-05-18 11:48:22 发布
原创 最新推荐文章于 2022-05-18 11:48:22 发布 · 2k 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文探讨了一个在iOS7和iOS8的Safari浏览器中，基本的JavaScript代码无法正常工作的bug。通过深入研究，发现仅需在特定元素的CSS中加入cursor:pointer;这一简单的样式声明，即可解决该问题。文章详细解释了原因，并提供了解决方案。

AI 时代程序员必备技能

Codex、Claude Code、Cursor、Hermes Agent、OpenClaw等工程化实战专栏 ，讲透 AI 如何接管脏活累活

一键订阅 
在项目中遇到一个很诡异的bug，下面这段特别基本的代码，在IOS7 ， IOS8下的Safari中竟然不起作用！仔细研究之后，发现这段代码用在A标签上，是有用的。
$("body").on("click",".xxx",function(e) {
    alert("clicked");
});
解决问题有点出乎意料地简单，只需要在.xxx的css上加上cursor:pointer;就能够正常使用了。
原因：http://www.quirksmode.org/blog/archives/2010/10/click_event_del_1.html
 


                

        

    


      

        

          

            

              

                
AI 时代程序员必备技能

              

              
Codex、Claude Code、Cursor、Hermes Agent、OpenClaw等工程化实战专栏 ，讲透 AI 如何接管脏活累活

            

          

          

            一键订阅
          

        

      





  




    

      

        

            

              
                
                  KeevaJ
                
              
            

            

                关注
              
            

        

        

          
      

      










                



	

		

			

				
					
click事件无法触发解决方案

				
			

			

				

					听闻青春丶
				

				

					05-31
					
					3896
					
				

			

		

		

			
				
方法： 这里使用了jq所以直接用了，大家可以改成原生写法


/**
 * 将touch事件改为点击事件
 * @param  {[string]}   dom      [css选择器]
 * @param  {[bool]}   derect      [方向 x为false,y方向为true]
 * @param  {Function} callback [要执行的函数]
 * @retur...

			
		

	



                

            
              



	

		

			

				
					
Vue下拉框使用@click点击失效的解决方案

				
			

			

				

					ws135867的博客
				

				

					07-18
					
					2288
					
				

			

		

		

			
				
通过各种尝试后，我发现在option中设置@click事件可以完美的解决以上问题。但是select下的option标签理论上是无法监听点击事件的，所以我在@click后面添加了.native修饰符。给select组件设置@click事件点击没有反应，设置@change事件也无法满足要求（这里涉及到click和change事件得执行顺序。@change：选择下拉框中的某个选项，当将要选择的选项与正在框中的值不一样才为一次change事件。但是文本框中的内容总是与我下拉框选中的值不一致。

			
		

	



              


  
              

                


	

		

			

				
					
jQuery中$.click()没有触发

				
			

			

				

					彭世瑜的博客
				

				

					03-06
					
					3730
					
				

			

		

		

			
				
在控制台调试的时候，直接点击元素是可以触发的，到了页面代码中却没有触发点击事件
$("#btn").click();

看了别人的两种处理方式：
（1）点击的是“A标签”本身
（2）点击的是“A标签”子元素
给a标签添加一个子元素，通过点击子元素触发
let span = document.createElement("span");
$("#btn").append(span);
span.cl...

			
		

	





	

		

			

				
					
click事件不生效

				
			

			

				

					baidu_41909653的博客
				

				

					05-18
					
					1371
					
				

			

		

		

			
				
问题描述
动态加载的元素上click事件不生效
$(".openORclose2").click(function () {
        if ($(this).hasClass("checkOpen2")) {
            $(this).removeClass("checkOpen2");
            $(this).parent().parent().removeClass("QAhover");
            $(this).parent().parent().

			
		

	



		

			
		



	

		

			

				
					
jquery绑定click事件，在ios7 8下不触发的bug   iPhone手机上使用jQuery的die、live和on注册click事件无法点击

				
			

			

				

					GuangRong1的博客
				

				

					07-07
					
					1071
					
				

			

		

		

			
				
在项目中遇到一个很诡异的bug，下面这段特别基本的代码，在IOS7 ， IOS8下的Safari中竟然不起作用！仔细研究之后，发现这段代码用在A标签上，是有用的。$("body").on("click",".xxx",function(e) {
    alert("clicked");
});解决问题有点出乎意料地简单，只需要在.xxx的css上加上cursor:pointer;就能够正常使用了...

			
		

	





	

		

			

				
					
ios下Safari无法触发click事件的处理

				
			

			

				

					Jack huang的专栏
				

				

					02-27
					
					1140
					
				

			

		

		

			
				

<!DOCTYPE html>
<html>
<head>
<title>122</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-sc

			
		

	





	

		

			

				
					
关于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

			
		

	





	

		

			

				
					
JQUERY ON() 方法绑定CLICK事件在苹果iPad上失效的问题

				
			

			

				

					zuotiaoyouxuan的博客
				

				

					05-02
					
					795
					
				

			

		

		

			
				
给异步元素myDiv绑定个事件，发现在苹果iPad上没有效果，而在手机中都一切正常
$(document).on(‘click’,’#unclaimed’,function(){
alert(‘000000’)
})
解决办法有三种
一、给元素myDiv加个样式cursor:pointer，很神奇吧，苹果的点击事件竟然和CSS有关系！认为只有手型的元素才能触发点击，oh----
#unclaime...

			
		

	





	

		

			

				
					
jquery动态绑定在IOS失效的问题

				
			

			

				

					JeffreyWang的技术博客
				

				

					03-08
					
					485
					
				

			

		

		

			
				
文章目录背景问题复现解决方案
背景
在一个微信项目中，由于某些元素是动态添加的，所以使用了jquery的on(‘click’, ‘xx’, function(){});来进行动态绑定点击事件，但是在IOS下，此法失效，经过一番资料查找，终于找到了解决方案。
问题复现
html代码：
<html>
	<head>
		<title>测试</title>...

			
		

	





	

		

			

				
					
关于jquery中on绑定click事件在苹果手机失效的问题(巨坑啊)

				
			

			

				

					lxw1844912514的博客
				

				

					01-17
					
					596
					
				

			

		

		

			
				
用一个div当做了一个按钮来使用。

<div class="button">
    <div class=" next_button button_left btn_red" style="width: 345px;">
    下一步
    </div>
</div> 

因为是动态添加的内容，所以想要使用cl...

			
		

	





	

		

			

				
					
ios 绑定事件无效

					
热门推荐

				
			

			

				

					纸上得来终觉浅
				

				

					06-14
					
					20万+
					
				

			

		

		

			
				
问题描述当使用委托给一个元素添加click事件时，如果事件是委托到 document 或 body 上，并且委托的元素是默认不可点击的（如 div, span 等），此时 click 事件会失效。测试代码<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="UTF-8">
    <meta name="viewport" content="w

			
		

	





	

		

			

				
					
关于<li>标签绑定的click事件在安卓机上位置偏移的记录

				
			

			

				

					qq_42063186的博客
				

				

					08-13
					
					667
					
				

			

		

		

			
				
首先记录一下具体细节：

最近参与了一个项目，需要统计到用户近六个月的消费详情。

使用的是mui框架。

js部分如下：


function initMonth() {
    var html="";
    var x=1;
    html +='&lt;ul id="monthList"&gt;'
    for (var i=0;i&lt;=5;i++){
        var d...

			
		

	





	

		

			

				
					
动态添加元素绑定事件的一些坑

				
			

			

				

					agxriys715453740的博客
				

				

					12-07
					
					176
					
				

			

		

		

			
				
问题描述
对于动态添加的元素需要绑定事件时，我们会用到事件委托来处理，当使用委托给一个元素添加click事件时，如果事件是委托到document或body上，并且委托的元素是默认不可点击的（如div,span等），此时click事件会失效。
可以使用下面的代码在 iOS 中进行测试。

<!DOCTYPE html>  
<html> ...

			
		

	





	

		

			

				
					
ios环境下页面的click事件失效问题

				
			

			

				

					木习习的博客
				

				

					10-15
					
					522
					
				

			

		

		

			
				
ios环境下页面的click事件失效问题

整理了下曾经在ios上遇到过的一个坑

当通过事件委托对document或body绑定click事件时，若实际点击的元素原来是不可点击的（如p，span，div等），ios环境下这个click事件不会被触发。
例如下面这段代码，在PC上调试时可以正常触发，到ios的safri中测试就不行。
&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html&amp;g...

			
		

	





	

		

			

				
					
click事件触发也有失灵的时候？

				
			

			

				

					weixin_30362801的博客
				

				

					08-28
					
					325
					
				

			

		

		

			
				
今天做了个手机页面，点击某个按钮->弹出菜单，再点击菜单以外的任意位置->关闭菜单，在其他浏览器里面没有问题，但是在IOS浏览器中并不会关闭。
网上解决这个bug的帖子很多，这篇帖子主要是讲原理，这里写个简单的代码，大家可以复制到自己页面中去实验：

<html>
<head>
<meta charset="utf-8">
<met...

			
		

	





	

		

			

				
					
jquery中on绑定click事件在苹果手机上失效的问题

				
			

			

				

					WEB_CSDN_SHARE的博客
				

				

					03-15
					
					607
					
				

			

		

		

			
				
用一个div当做了一个按钮来使用。


&lt;div class="button"&gt;
    &lt;div class=" next_button button_left btn_red" style="width: 345px;"&gt;
    下一步
    &lt;/div&gt;
&lt;/div&gt;

因为是动态添加的内容，所以想要使用click事件，需要给他

			
		

	





	

		

			

				
					
ios微信端 手机版网页 委托事件点击事件 click触发事件span不可以 a可以

				
			

			

				

					guoyanga1的博客
				

				

					01-15
					
					2060
					
				

			

		

		

			
				
1.框架是laravel
ios版本：11.2最新版 
最近在项目中遇到一个问题，就是ios微信端商品列表数据是ajax请求返回的，不是页面渲染的，这个时候给了live事件安卓手机正常触发，ios不可以。因为是委托事件
解决方案：测试span标签不可以后，用了委托事件。
html:点我js文件：$(document).delegate('.btn','click',function(){}

			
		

	





	

		

			

				
					
ios和安卓的input的click事件和change事件的加载顺序问题。

				
			

			

				

					weixin_38597686的博客
				

				

					10-27
					
					3214
					
				

			

		

		

			
				
最近开发webapp遇到一个问题 ，同一个input单选按钮，在安卓机里就可以实现与二级联动的效果(以及按钮不选，二级按钮为disabled)，但是在ios里面效果实现不出来，因为逻辑稍微复杂，点击改变背景图片还要改变状态，还要监控其他单选按钮复选框，所以在一个radio上面绑定了click和change事件。问题：安卓里面是先触发click事件，后触发change事件。但是IOS里面是先触发cha

			
		

	



              




          





        



    





    



      

      

        
      

      





	

		评论	
	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值