第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會(huì)有你想問的

如何確保函數(shù)“window.location.reload()”只觸發(fā)一次而不是無限循環(huán)？

如何確保函數(shù)“window.location.reload()”只觸發(fā)一次而不是無限循環(huán)？

白板的微信 2022-10-13 19:22:34
我試圖向我的網(wǎng)頁添加一個(gè)可訪問性功能，它是用 React.js 構(gòu)建的，以確保我的橫幅顏色不會(huì)受到 Chrome 的高對(duì)比度插件的影響。我嘗試通過添加一個(gè)函數(shù)來檢測(cè) Chrome 插件是否已打開來實(shí)現(xiàn)它，并且我的代碼應(yīng)該切換一個(gè)類以確保橫幅顏色在高對(duì)比度模式下不會(huì)發(fā)生太大變化。我注意到這個(gè)變化只有在刷新頁面后才能看到，所以我添加了這行代碼window.location.reload()來手動(dòng)重新加載頁面。問題是，這部分代碼進(jìn)入了一個(gè)無限循環(huán)，我的頁面不會(huì)停止重新加載。我嘗試用其他方法替換reloading部分，結(jié)果還是一樣。這是我的 React 組件的代碼： componentDidMount = () => {    this.keepBannerColor()}keepBannerColor() {    // these two lines of code below is tell whether the browser is chrome    let userAgentString = navigator.userAgent;    let chromeAgent = userAgentString.indexOf("Chrome") > -1;    let header = document.querySelector('.mizaru-header')    if (header && chromeAgent) {        console.log('funciton triggered')        let htmlTag = document.getElementsByTagName('html');        let isInverted = htmlTag[0].getAttribute('hc') != null        header.classList.toggle('inverted', isInverted)        window.location.reload()    }}這是我的切換類的 CSS 代碼：.inverted{ filter: invert(100%); }你能幫忙的話，我會(huì)很高興！
查看完整描述

2 回答

?
慕森卡

TA貢獻(xiàn)1806條經(jīng)驗(yàn) 獲得超8個(gè)贊

為什么不嘗試將指標(biāo)保存到localstorageorsessionstorage中，并在 if 條件中添加此驗(yàn)證：


您的代碼片段：


...

// Use local or session storage

let hasReloaded = localStorage.getItem('hasReloaded')


if (header && chromeAgent && !hasReloaded) {

  console.log('funciton triggered')

  let htmlTag = document.getElementsByTagName('html');

  let isInverted = htmlTag[0].getAttribute('hc') != null

  header.classList.toggle('inverted', isInverted)

  // Set hasRealoaded to true

  localStorage.setItem('hasReloaded', true)

  window.location.reload()

}

...



查看完整回答
反對(duì) 回復(fù) 2022-10-13
?
臨摹微笑

TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊

您不需要為此重新加載頁面，您需要MutationObserver.

這將在特定元素上查找文檔中的更改。

當(dāng)hc屬性被動(dòng)態(tài)添加到頁面時(shí)，它將在添加或刪除它時(shí)進(jìn)行偵聽。

"High Contrast", "a4"如果打開高對(duì)比度模式（“a4”根據(jù)設(shè)置更改）和“高對(duì)比度關(guān)閉”如果插件未激活，則以下將記錄。

下面的美妙之處在于，根據(jù)設(shè)置“a3”、“a4”等，您可以應(yīng)用不同的樣式。

當(dāng)插件被禁用時(shí)，下面的內(nèi)容有些不正確，好像兩次觸發(fā)“高對(duì)比度關(guān)閉”，因此您需要對(duì)此進(jìn)行調(diào)查。（這是因?yàn)楫?dāng)插件關(guān)閉時(shí)，它首先將狀態(tài)設(shè)置為“a0”，然后刪除屬性，在正常使用下應(yīng)該沒問題，但只是需要注意的一點(diǎn)）。

  const targetNode = document.documentElement;


// Options for the observer (which mutations to observe)

const config = { attributes: true};


// Callback function to execute when mutations are observed

const callback = function(mutationsList, observer) {

    // Use traditional 'for loops' for IE 11

    

    let name = "";

    

    for(let mutation of mutationsList) {

       if (mutation.type === 'attributes') {

           if(mutation.attributeName == "hc"){

               if(mutation.target.attributes.getNamedItem(mutation.attributeName) != null && mutation.target.attributes.getNamedItem(mutation.attributeName).value != "a0"){

               console.log("High Contrast", mutation.target.attributes.getNamedItem(mutation.attributeName).value);

           }else{

               console.log("High Contrast Off");

           }

           }

            

        }

    }

};


// Create an observer instance linked to the callback function

const observer = new MutationObserver(callback);


// Start observing the target node for configured mutations

observer.observe(targetNode, config);


查看完整回答
反對(duì) 回復(fù) 2022-10-13
  • 2 回答
  • 0 關(guān)注
  • 256 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)