时间戳

首页 > 解决方案 > 更改页面后附加事件会发生什么？

javascript - 更改页面后附加事件会发生什么？

问题描述

考虑这种情况：

2 个略有不同的页面，带有 2 个略有不同的表格：user-table和admin-table. 两者都实现了分页。让我们假设这个

<div class="pager">
    Pager implementation
</div>

我将事件附加到.pager, 页码按钮，并在不同的文件中执行两次。每个文件都有不同的寻呼机实现（即调用不同的控制器）。脚本包含在其相应的页面中，并在加载 DOM 后加载。

用户表.js

$('.pager').on('click', '.page', function() {
    $.get(...) //calling user-controller to get the results
};

admin-table.js

$('.pager').on('click', '.page', function() {
    $.get(...) //calling admin-controller to get the results
};

不知何故，这有效并且不冲突。这对我来说是违反直觉的。

当我导航到用户页面时，user-table.js已加载。单击页码后，将触发事件并加载内容。

当我导航到管理页面并执行相同操作时会发生什么？为什么它有效？导航后，正在加载第二个脚本并分配/委派新事件。不应该有冲突吗？上一页/脚本中的事件是否“被遗忘”？脚本将被缓存，我期待再次发生冲突，但事实并非如此。

有人可以向我解释工作流程或事件生命周期吗？离开页面后现有事件会发生什么？我尝试使用谷歌搜索，但找不到任何相关内容。

标签： javascriptjqueryjquery-events

解决方案

上一页/脚本中的事件是否“被遗忘”？

是的。HTML 是完全无状态的。浏览器只会考虑当前加载到 DOM 中的内容。当 beforeunload 事件触发时，所有以前的页面都会从内存中删除。

推荐阅读