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

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

Chrome/Opera `window.onpopstate` 錯(cuò)誤

Chrome/Opera `window.onpopstate` 錯(cuò)誤

偶然的你 2023-08-18 17:04:46
我正在嘗試處理window.onpopstate我的單頁(yè)應(yīng)用程序中的事件，但在 Google Chrome 和 Opera 中它不起作用。這是我的簡(jiǎn)單 html 頁(yè)面<html>? ? <head>? ? ? ? <meta charset="utf-8" />? ? ? ? <script>? ? ? ? window.onpopstate = function(e) {? ? ? ? ? ? alert('onpopstate');? ? ? ? }? ? ? ? setTimeout(function () {? ? ? ? ? ? history.pushState(1, 'Hello John', '/hello/john');? ? ? ? }, 2000);? ? ? ? setTimeout(function () {? ? ? ? ? ? history.pushState(2, 'Hello Emily', '/hello/emily');? ? ? ? }, 3000);? ? ? ? </script>? ? </head>? ? <body></body></html>當(dāng)我點(diǎn)擊瀏覽器的后退按鈕時(shí)，我希望看到帶有onpopstate顯示文本的警報(bào)。在 Safari、Firefox、Vivaldi 中，它按預(yù)期工作。在 Chrome 和 Opera 中，它從未調(diào)用過(guò)，它只是通過(guò)重新加載來(lái)轉(zhuǎn)到上一頁(yè)，這對(duì)我的 SPA 來(lái)說(shuō)是一個(gè)糟糕的情況。更奇怪的是我發(fā)現(xiàn)了一些讓它發(fā)揮作用的技巧：轉(zhuǎn)到開發(fā)工具，控制臺(tái)選項(xiàng)卡但是，如果我在有或沒(méi)有超時(shí)的頁(yè)面上的腳本中執(zhí)行相同的操作，則此技巧根本不起作用。因此，我發(fā)現(xiàn)完成工作的唯一方法是手動(dòng)轉(zhuǎn)到控制臺(tái)并執(zhí)行。console.log(history)console.log(window)onpopstateconsole.log(history)也許我錯(cuò)過(guò)了什么？任何幫助，將不勝感激。我的環(huán)境：macOS 11.0.1 (20B29)Chrome 87.0.4280.67（官方版本）(x86_64)歌劇 72.0.3815.378解決方案：好吧，這不是一個(gè)錯(cuò)誤，這是一個(gè)功能！這是interact firstChromium 的一個(gè)特性。如果用戶首先以某種方式與頁(yè)面交互，那么一切都會(huì)正常，否則back button將通過(guò)重新加載返回。例如，只需在正文中添加一些按鈕并先單擊它，然后嘗試back在瀏覽器中單擊。<body> ????<button?onclick="alert('hello');">alert</button> ????</body>
查看完整描述

2 回答

?
慕后森

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

為了能夠運(yùn)行一些 JavaScript，例如移動(dòng)歷史記錄或播放聲音或彈出窗口，用戶首先必須在網(wǎng)站上進(jìn)行交互（單擊）。

查看完整回答
反對(duì) 回復(fù) 2023-08-18
?
互換的青春

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

我在 MDN 上找到了一個(gè)注釋。它說(shuō)：

注意：調(diào)用history.pushState()或history.replaceState()不會(huì)觸發(fā)popstate事件。popstate 事件僅通過(guò)執(zhí)行瀏覽器操作來(lái)觸發(fā)，例如在同一文檔的兩個(gè)歷史記錄條目之間導(dǎo)航時(shí)單擊后退按鈕（或在 JavaScript 中調(diào)用history.back()）。

我建議您將事件處理程序注冊(cè)到WindowEventHandlers 的 onpopstate 屬性addEventListener()，而不是注冊(cè)到WindowEventHandlers的onpopstate屬性。

例子：

<html>

? ? <head>

? ? ? ? <meta charset="utf-8" />

? ? ? ? <script>

? ? ? ? ? ? // ref: https://developer.mozilla.org/en-US/docs/Web/API/Window/popstate_event

? ? ? ? ? ? window.addEventListener('popstate', function(e) {

? ? ? ? ? ? ? ? alert('onpopstate');

? ? ? ? ? ? }

? ? ? ? ? ? setTimeout(function () {

? ? ? ? ? ? ? ? history.pushState(1, 'Hello John', '/hello/john');

? ? ? ? ? ? }, 2000);

? ? ? ? ? ? setTimeout(function () {

? ? ? ? ? ? ? ? history.pushState(2, 'Hello Emily', '/hello/emily');

? ? ? ? ? ? }, 3000);

? ? ? ? </script>

? ? </head>

? ? <body></body>

</html>


查看完整回答
反對(duì) 回復(fù) 2023-08-18
?
慕斯王

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

使用 anObject表示state。

狀態(tài)對(duì)象是一個(gè) JavaScript 對(duì)象，與 PushState() 創(chuàng)建的新歷史記錄條目相關(guān)聯(lián)。每當(dāng)用戶導(dǎo)航到新?tīng)顟B(tài)時(shí)，都會(huì)觸發(fā) popstate 事件，并且該事件的 state 屬性包含歷史記錄條目的狀態(tài)對(duì)象的副本。

const log = Logger();


// create 3 'history pages'

history.pushState({page: 1, greet: "Hello John"}, '', "#John");

history.pushState({page: 2, greet: "Hello Emily"}, '', "#Emily");

history.pushState({page: 3, greet: "Hello James"}, '', "#James");


log(`current history state: ${JSON.stringify(history.state)}`);


// on popstate log the history state if applicable

window.addEventListener("popstate", () =>

? history && history.state && log(`${history.state.greet || ""} @page ${

? ? history.state.page} (location: ${location.hash})`)

);


// listener for the buttons

document.addEventListener("click", evt => {

? if (evt.target.nodeName === "BUTTON") {

? ? return evt.target.id === "back" ? history.back() : history.forward();

? }

});


// helper function for logging in the document

function Logger() {

? let logEl;

? if (typeof window === "object") {

? ? logEl = document.querySelector("#log") || (() => {

? ? ? document.body.append(

? ? ? ? Object.assign(document.createElement('pre'),?

? ? ? ? {id: "log"}));

? ? ? return document.querySelector("#log");

? ? })();

? ? return (...logLines) =>?

? ? ? logLines.forEach(s => logEl.textContent += `${s}\n`);

? } else {

? ? return (...logLines) =>?

? ? ? logLines.forEach(ll => console.log(`* `, ll));

? }

}

<button id="back">&lt;&lt; 1 back</button>

<button id="forward">1 forward &gt;&gt;</button>


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

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號(hào)

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