ios10以下safari设置style无效
项目中遇到的奇怪问题,已定位原因。Attempted to assign to readonly property报错
起因:项目中写了个点击事件,增加动态效果,类似于转一转,rotate(360)。很简单的一个特效。
设置元素的transition:transform 1s。 然后动态改变元素的transfrom:rotate的角度。一切看起来没问题。本地测试,真机测试都OK。但是提测后,在测试的IOS10下的safari,竟然没有生效。
定位原因: 一开始以为是transform没有加上前缀。但确认后排除。于是真机连接代理测试,在点击事件中alert弹窗,发现并没有执行。于是确认有报错。try catch后弹出错误。
Attempted to assign to readonly property
查阅资料得知,是safari内核bug。网上有解决方案,不要使用严格模式,即删除'use strict'。
(没有验证,因为觉得不可行,因小失大)
解决方案。 猜测是因为Style不可以直接change,但应该可以设置Style.transform。测试可行,但这样设置多个属性的时候,并不优雅,可换成class。 不过因为rotate角度涉及到计算,故而本人并没有采用设置class的方案。
错误: dom.style = `transform: rotate(${x}deg)`; 正确 dom.style.transfrom = 'rotate(${x}deg)';
相关推荐
安辉 2019-10-30
waterv 2019-10-30
sunshineboyleng 2020-07-08
impress 2020-05-11
yaodilu 2020-04-30
/*垂直居中,div上边界距离窗口上边的距离为窗口高度的50%,并针对不同浏览器进行兼容。-- 在外层添加一个div,把行内容居中,添加.row .justify-content-center -->
Phoebe的学习天地 2020-04-14
福叔 2020-04-11
zjuwangleicn 2020-03-08
冰蝶 2020-03-01
somboy 2020-02-29
zengni 2020-02-23
wangjie 2020-02-22
tianzyc 2020-02-19
冰蝶 2020-02-16
lanzhusiyu 2020-02-03
lanzhusiyu 2020-01-12
MaureenChen 2020-01-01
jiedinghui 2019-12-27