a:active在ios上无效解决方法

Posted 糖糖部落

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了a:active在ios上无效解决方法相关的知识,希望对你有一定的参考价值。

原因:

By default, Safari Mobile does not use the :active state unless there is a 
touchstart event handler on the relevant element or on the <body>.

解决方法:

1.body标签上添加ontouchstart空方法(页面首个元素起作用)

<body ontouchstart="">

</body>

2.document或body添加touchstart空事件(页面首个元素起作用)

document.addEventListener("touchstart", function() {},false);
//
document.body.addEventListener("touchstart", function() {})

/*添加如下css配合*/
html {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

  

3.单个a元素添加ontouchstart空事件

<a ontouchstart="">Click me</a>

4.所有a元素添加touchstart空事件

var a=document.getElementsByTagName(‘a’);

for(var i=0;i<a.length;i++){

    a[i].addEventListener(‘touchstart’,function(){},false);

}


参考:https://stackoverflow.com/questions/3885018/active-pseudo-class-doesnt-work-in-mobile-safari
           http://blog.csdn.net/freshlover/article/details/43735273






以上是关于a:active在ios上无效解决方法的主要内容,如果未能解决你的问题,请参考以下文章

iOS -- 解决iOS11中navigationBar上使用initWithCustomView按钮图片错位 frame无效

Spring Rest 文档。片段生成时 UTF-8 中间字节无效 [重复]

IOS开发证书变成“此证书的签发者无效”解决方法

iOS开发证书变成“此证书的签发者无效”解决方法

IOS中证书无效的解决方法

IOS开发证书变成“此证书的签发者无效”解决方法