jquery中on绑定click事件在苹果手机失效问题解决（巨坑啊）

POOPE

描述：用一个div写一个按钮，并给这个按钮添加一个点击事件，在安卓机器上一切正常，但是在苹果机型上会出现点击事件失效。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .redButton{
      width: 50px;
      height: 50px;
      background: red;
      text-align: center;
      line-height: 50px;
    }
  </style>
</head>
<body>
<div class="button">
  <div class="redButton">
    按钮
  </div>
</div>
<script src="jquery-3.0.0.min.js"></script>
<script>
  $(document).on("click",".redButton",function(){
    alert('点击了按钮');
  });
</script>
</body>
</html>

解决苹果机点击失效代码：
为什么会出现这个问题：苹果机对于点击的对象，要拥有cursor:pointer这个样式的设置，也就是说，鼠标放上去，能够出现“手”型的图标才被认作可以使用点击事件，然后就加一行css咯~

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .redButton{
      width: 50px;
      height: 50px;
      background: red;
      text-align: center;
      line-height: 50px;
      cursor:pointer;   //光标呈现为指示链接的指针
    }
  </style>
</head>
<body>
<div class="button">
  <div class="redButton">
    按钮
  </div>
</div>
<script src="jquery-3.0.0.min.js"></script>
<script>
  $(document).on("click",".redButton",function(){
    alert('点击了按钮');
  });
</script>
</body>
</html>

[jQuery] jquery中on绑定click事件在苹果手机失效问题解决（巨坑啊）

相关帖子

了解下Foundation 按钮组

电脑音量键点击没反应解决方法

PHP7 Null合并运算符

使用HTML/CSS/JS做一个恋爱计时小挂件

css3超酷的按钮鼠标经过特效

常用jquery右健禁止命令

Q+CSS+DIV多彩随机变化链接样式tag标签样式

7种好看的鼠标点击效果

Discuz应用中心恢复授权的方法

使用原生querySelectorAll和forEach来实现点击切换

POOPE LV4