【js】第一次加载js失效，如果我再刷新则会成功，why?

最新推荐文章于 2022-09-13 10:07:57 发布

芳月存心

最新推荐文章于 2022-09-13 10:07:57 发布

阅读量7.6k

点赞数

前端那些事专栏收录该内容

54 篇文章

订阅专栏

本文探讨了在AJAX请求过程中jQuery如何处理页面加载及JavaScript执行的问题。文章解释了为何在AJAX请求期间jQuery只会加载页面头部，并提出了解决方案，如使用特定事件触发来初始化页面上的JavaScript功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当ajax正在运作请求的时候，jquery是不会加载完整的一个页面的，它只是会提取这个页面的头部标签。这个逻辑是这么进行处理的，jquery提取了头部标签只是为了更快的去加载这个页面，减少下载或者请求加载的时间，然后自己提取出的头部标签再和剩下的html页面整合成一个完整的页面。这就是为什么为先得到头部导航。

jquery依旧不会先运作任何js在ajax尚未加载完全或者正在进行请求的时候。而此时加入你想要做点什么事情，例如：onClick="SomeJS();"，很遗憾这个事件不会生效的，一般是不会在jquery未加载完操作任何事件的。

为了绕过这个机制，和预防js在每一页上发生错误。我是这样考虑的：

在body标签中，使用一个div节并设置一个ID或者加上一个class或者使用h5特性 data-role='page'

<body>
<div id="page1" data-role="page">
... page content ...
</div>
</body>

在每个页面上你所有涉及的js文件不用去管。而只是在一个页面上你有特点的js去运作的话，只需要这么写：

$('#page1').live('pageshow', function() {
//do what you need to do
});

ps:这个解决方案感觉没什么用。但是这个逻辑回答倒是让我想了一下。ajax在进行加载的时候确实任何的js都是失效，所以我只需要在ajax成功请求之后写我特定的js事件进行一遍初始化就好。这样感觉简直是有毒一样。不过也可以关掉ajax的异步加载机制，或许也能让js在第一次进行页面加载的时候跑起来。

原文链接：https://stackoverflow.com/questions/10006341/js-doesnt-work-if-i-dont-refresh-the-page-after-first-load-why