已解決430363個問題，去搜搜看，總會有你想問的

如何在頁面之間重新初始化自定義js文件（Barba.js）？

首頁猿問如何在頁面之間重新初始化自定義js...

如何在頁面之間重新初始化自定義js文件（Barba.js）？

JavaScript

慕妹3146593 2023-08-18 17:25:31

我有 Barba.js 在我正在開發的網站上工作，我已經調試了一些其他問題，但我注意到我的 jS 沒有在頁面之間重新初始化，這不是預期的行為。請參閱下面的代碼（出于 DRY 目的，我已刪除了實際網站內容）：索引.html：<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/png" href="favicon.png" /><title>TEST.</title><link type="text/css" rel="stylesheet" href="fonts/fontsauce.css" /><link rel="stylesheet" href="css/globals.css"><link rel="stylesheet" href="css/header.css"><link rel="stylesheet" href="css/app.css"><link rel="stylesheet" href="css/videoModal.css"><script src="js/lib/jQuery/jquery-3.5.1.min.js"></script><script src="js/lib/anime/anime.min.js"></script><script src="js/lib/parallax/parallax.min.js"></script><script src="js/lib/barba/2.9.7/barba.umd.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/gsap.min.js" integrity="sha512-IQLehpLoVS4fNzl7IfH8Iowfm5+RiMGtHykgZJl9AWMgqx0AmJ6cRWcB+GaGVtIsnC4voMfm8f2vwtY+6oPjpQ==" crossorigin="anonymous"></script></head><body id="barba-wrapper" data-barba="wrapper"> <main class="barba-container" data-barba="container" data-barba-namespace="home"> // all my website content // </main> <script src="js/introParams.js"></script> <script src="js/parallaxParams.js"></script> <script src="js/content.js"></script> <script src="js/videoModal.js"></script> <script src="js/pageTransitions.js"></script></body>據我了解，問題是每次將新頁面的內容加載到 DOM 中時，它都不會重新初始化我的其他腳本。有什么想法可以如何正確地重新初始化其他腳本嗎？

查看完整描述

2 回答

慕無忌1623718

TA貢獻1744條經驗獲得超4個贊

就像在回調中重置滾動一樣，beforeEnter您還需要從腳本中調用 init 方法，以在新頁面加載時重置它們。afterEnter如果您需要訪問新頁面 dom，您也可以這樣做。來自 barba.js 文檔：

barba.init({

? views: [{

? ? namespace: 'home',

? ? beforeEnter() {

? ? ? // re-init/reset script default function on before page load

? ? ? myScriptInit();

? ? },

? ? afterEnter() {

? ? ? // refresh parallax on new page content

? ? ? parallax.refresh();

? ? }

? }]

});

反對回復 2023-08-18

Qyouu

TA貢獻1786條經驗獲得超11個贊

就我而言，這有幫助：

barba.hooks.after(() => {

const bottomDOM = document.getElementsByTagName("body")[0]

const newScript = document.createElement("script")

const oldScript = document.querySelector(".main-script")

newScript.src = "js/main-dist.js"

newScript.className = "main-script"

oldScript.remove()

bottomDOM.appendChild(newScript)

})

我<script class="main-script"></script>在 DOM 末尾有一個，并使用 barba.hook 刪除它，然后再次添加它

反對回復 2023-08-18

2 回答
0 關注
171 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在頁面之間重新初始化自定義js文件（Barba.js）？

如何在頁面之間重新初始化自定義js文件（Barba.js）？

2 回答

添加回答

如何在頁面之間重新初始化自定義js文件（Barba.js）？

如何在頁面之間重新初始化自定義js文件（Barba.js）？