html－手机端－点击按钮－去高亮－加点击效果

（1）前提：html页面 ，手机端，

（2）问题一：

在iphone上（貌似是9以后。。），给div/span/...等元素上加onclick事件，根本不起作用，这是为啥捏？

－－ 在元素上加  cursor:pointer;  添加上后，系统会默认为这是一个可点击的元素。

cursor:pointer

（3）问题二：

在做手机页面时候，（iphone和安卓上都会有这个问题），点击一个按钮时，会出现的大黑块，特别不好看，怎么去掉大黑块儿呢？

－－在元素上添加 -webkit-tap-highlight-color属性后，就可以去掉默认的大黑块儿

-webkit-tap-highlight-color: transparent;

（4）问题三：

当我们去掉默认的大黑块儿后，要添加自己想要的点击时按住按钮的效果，用以下代码：

span:active{
    box-shadow: inset 0 5px 10px #B41313,inset 0 -5px 10px #B41313;
  }

      

添加完上述代码后，在安卓上，都可以看到想要的效果，但是iphone上依旧无动于衷。。。。。

怎么办？

经过查资料和实际测试后，发现，:active  需要一个触发事件才可以，于是乎，用以下代码：

<script type="text/javascript">
        document.body.addEventListener('touchstart', function () {
        });
    </script>

在页面上给一个监听事件，就可以触发:active，就可以兼容iphone上点击按下时的效果了！！！