WinJS 在导航时保留元素 ID答案

【问题标题】：WinJS Retaining Element IDs When NavigatingWinJS 在导航时保留元素 ID
【发布时间】：2014-02-06 16:26:06
【问题描述】：

我正在使用 Navigator 模板开发一个 WinJS 应用程序，但遇到了一个奇怪的问题。

在应用程序中有一个带有一些过滤器的搜索页面，当单击搜索结果时，应用程序导航到另一个页面以编辑该项目。

问题是两个页面都有一个 id 相同的标签，并且当在第二个页面中通过 JavaScript 访问元素时，它正在从搜索页面返回元素。

我可以看到这可能是由于 JS/CSS 在单页应用程序中的加载方式而导致的预期行为，但我应该做些什么来卸载元素/JS？

我很感激我可以为每个页面唯一地命名元素，但是随着越来越多的人在应用程序上工作并且功能不断增长，我可以看到我们的团队一次又一次地遇到这个问题。

【问题讨论】：

如果您正在执行单页导航，这可能是预期的行为。我猜这是因为搜索页面是隐藏的，而不是从 DOM 中删除。您可以做很多事情：更改任一元素的 ID，使用类而不是 ID 来获取元素，在结果加载时从搜索页面中删除该元素。

【解决方案1】：

您是说您正在使用导航模板？如果是这样，我假设您没有对 navigator.js 进行任何更改。通过“搜索页面”，这是一个单独的 PageControl 还是一个搜索合同？

navigator.js 中的 PageControlNavigator._navigating 方法包含几个重要的调用，可以摆脱旧的 PageControl：

- 当然， PageControlNavigator 只有在您使用 WinJS.Navigator.navigate 加载新页面时才会被调用。

诊断此问题的最佳方法是在调试应用程序并查看 DOM 资源管理器时切换到桌面。

一种解决方法可能是向搜索页面的 PageControl.unload 成员添加一些代码，从 DOM 中删除所有元素。您可以在主机元素上使用WinJS.Utilities.empty 将它们全部删除。当用户导航回搜索页面时，存储在应用程序中的 HTML 将被加载回 PageControl 主机。

【讨论】：