关于苹果手机:active设置无效的问题
发表：紫石头原创模板堂 发表时间：2019-07-17 10:32:03 阅读：329次
前段时间，发现iphone设备不兼容CSS的:active，为了找到解决方法，去搜了一下。
原因
其实就是：苹果手机浏览页面中设置的css伪类：active失效了。
解决方法
在iOS系统的移动设备中，需要在按钮元素或body/html上绑定一个touchstart事件才能激活:active状态。
要让css的:active伪类生效，只需要给这个元素的touchstart/touchend绑定一个空的匿名方法即可成功。
Use the :active pseudo-class in your css, then add ontouchstart="" and onmouseover="" to the body tag.（在您的css中使用:active伪类，然后添加ontouchstart=“”和onmouseover=“”到body标签。）
<body ontouchstart="" onmouseover="">
</body>
问题来了：vue该怎么绑？
答：使用v-on指令。即v-on:touchstart=""。
用法：<button v-on:click="say1()">点击1</button>
注：v-on指令相当于绑定事件的监听器。绑定的事件触发了，就可以指定事件的处理函数。
十六年网站建设相关经验
一站式为您提供网站相关服务
欢迎扫码咨询
