ios10以下safari設(shè)置style無(wú)效的解決方法-創(chuàng)新互聯(lián)

項(xiàng)目中遇到的奇怪問(wèn)題,已定位原因。Attempted to assign to readonly property報(bào)錯(cuò)

嵊州網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián),嵊州網(wǎng)站設(shè)計(jì)制作,有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為嵊州1000多家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\外貿(mào)網(wǎng)站制作要多少錢,請(qǐng)找那個(gè)售后服務(wù)好的嵊州做網(wǎng)站的公司定做!

起因:項(xiàng)目中寫了個(gè)點(diǎn)擊事件,增加動(dòng)態(tài)效果,類似于轉(zhuǎn)一轉(zhuǎn),rotate(360)。很簡(jiǎn)單的一個(gè)特效。
設(shè)置元素的transition:transform 1s。 然后動(dòng)態(tài)改變?cè)氐膖ransfrom:rotate的角度。一切看起來(lái)沒(méi)問(wèn)題。本地測(cè)試,真機(jī)測(cè)試都OK。但是提測(cè)后,在測(cè)試的IOS10下的safari,竟然沒(méi)有生效。

定位原因: 一開(kāi)始以為是transform沒(méi)有加上前綴。但確認(rèn)后排除。于是真機(jī)連接代理測(cè)試,在點(diǎn)擊事件中alert彈窗,發(fā)現(xiàn)并沒(méi)有執(zhí)行。于是確認(rèn)有報(bào)錯(cuò)。try catch后彈出錯(cuò)誤。

Attempted to assign to readonly property

查閱資料得知,是safari內(nèi)核bug。網(wǎng)上有解決方案,不要使用嚴(yán)格模式,即刪除'use strict'。
(沒(méi)有驗(yàn)證,因?yàn)橛X(jué)得不可行,因小失大)

解決方案。 猜測(cè)是因?yàn)镾tyle不可以直接change,但應(yīng)該可以設(shè)置Style.transform。測(cè)試可行,但這樣設(shè)置多個(gè)屬性的時(shí)候,并不優(yōu)雅,可換成class。 不過(guò)因?yàn)閞otate角度涉及到計(jì)算,故而本人并沒(méi)有采用設(shè)置class的方案。

錯(cuò)誤:  dom.style = `transform: rotate(${x}deg)`;

正確   dom.style.transfrom = 'rotate(${x}deg)';

PS:解決iOS10的Safari下Meta設(shè)置user-scalable=no無(wú)效的方法

蘋果為了提高Safari中網(wǎng)站的輔助功能,屏蔽了Meta下的user-scalable=no功能。所以在iOS10下面,就算加上user-scalable=no,Safari瀏覽器也能支持手動(dòng)縮放。

我們可以用js加監(jiān)聽(tīng)事件來(lái)阻止手動(dòng)縮放。

代碼如下:

window.onload=function () { 
    document.addEventListener('touchstart',function (event) { 
      if(event.touches.length>1){ 
        event.preventDefault(); 
      } 
    }) 
    var lastTouchEnd=0; 
    document.addEventListener('touchend',function (event) { 
      var now=(new Date()).getTime(); 
      if(now-lastTouchEnd<=300){ 
        event.preventDefault(); 
      } 
      lastTouchEnd=now; 
    },false) 
  }

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站bm7419.com,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

本文標(biāo)題:ios10以下safari設(shè)置style無(wú)效的解決方法-創(chuàng)新互聯(lián)
URL鏈接:http://bm7419.com/article14/dseoge.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供小程序開(kāi)發(fā)、定制網(wǎng)站關(guān)鍵詞優(yōu)化網(wǎng)站改版、軟件開(kāi)發(fā)、微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁(yè)設(shè)計(jì)公司