gpt4 book ai didi

javascript - 为什么 "load"或 "DOMContentLoaded"不阻止在页面加载之前触发提示?

转载 作者:行者123 更新时间:2023-11-29 19:03:27 24 4
gpt4 key购买 nike

问题:Javascript 在我的页面加载之前触发

解决方案:将 Javascript 包装在一个函数中,并在页面加载后调用它。

不幸的是,它没有用。这是我的例子。

我有一个简单的 2 页测试站点。第一页有蓝色背景和指向第二页的链接。当我单击第一页上的链接时,第二页上脚本的提示会在第二页加载之前出现在第一页上。 loadDOMContentLoaded 似乎没有改变这一点。我确定我做错了什么,但我无法发现它。

第 1 页

<body style="background-color:blue">
<a href="page_2.htm">Click this link.</a>
</body>

第 2 页

<script>
function globalFunction() {
prompt("input a number");
}
</script>

我在第二页的函数上方添加了这段代码,但在加载第二页之前,提示继续在第一页上方提前弹出。

document.addEventListener("DOMContentLoaded", globalFunction);

然后我尝试了这个但得到了相同的结果。

window.addEventListener("load", globalFunction);

最佳答案

当浏览器创建不属于文档本身的 UI 元素时,这是典型的行为。浏览器是一个多线程软件,对 prompt()alert() 的调用在与运行 JavaScript 代码的线程不同的线程中处理. 在浏览器能够显示第二个页面之前,浏览器能够更新 UI(在本例中使用模态对话框阻止 JS 运行时继续运行)。

一个解决方案是确保脚本在第二个页面加载之前甚至不会启动,并且将提示延迟到足够长的时间,以便浏览器可以更新页面显示以显示它。

在您的第二个文件中,将代码更改为:

<script>
window.addEventListener("DOMContentLoaded", function(){
setTimeout(function globalFunction() {
prompt("input a number");
}, 20);
});
</script>

这将使函数运行延迟 20 毫秒,这段时间应该足以查看第二页。

关于javascript - 为什么 "load"或 "DOMContentLoaded"不阻止在页面加载之前触发提示?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44998768/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com