我有一个带有多个单页的 jQueryMobile 应用程序,它们链接在一起。其中一些页面使用常见的 javascript 文件。所以我目前只在需要它们的页面中导入这些 javascript。例如:
页面 A -> 包含 fileutils.js 并具有到页面 B 页面 B -> 包含 fileutils.js 的链接
用户从页面A点击页面B。是否存在多次导入fileutils.js并多次执行其代码的风险?
提前致谢
我有一个带有多个单页的 jQueryMobile 应用程序,它们链接在一起。其中一些页面使用常见的 javascript 文件。所以我目前只在需要它们的页面中导入这些 javascript。例如:
页面 A -> 包含 fileutils.js 并具有到页面 B 页面 B -> 包含 fileutils.js 的链接
用户从页面A点击页面B。是否存在多次导入fileutils.js并多次执行其代码的风险?
提前致谢
你不必担心。让我解释一下 jQuery Mobile 是如何工作的。
您所拥有的称为多HTML
页模板。在这种情况下,只有初始页面HTML
可以包含多于data-role="page"
一页,其他所有后续页面只能包含data-role="page"
一页。
一个第一页被初始化,它被完全加载到 DOM 中。该HTML
页面成为未来页面加载的框架。因为它是完全加载的,所以它可以容纳多于data-role="page"
一页。
初始化下一页时,jQuery Mobile 将剥离所有内容并仅加载data-role="page"
内容。其他所有内容都将被丢弃,包括 HEAD 内容。甚至更多只有第一data-role="page"
页将被加载,这意味着你不能有超过一个data-role="page"
页面。
这意味着如果您在后续页面中有自定义 javascript,它必须在data-role="page"
div 中,否则 jQuery Mobile 将丢弃它。
这适用于标准AJAX
加载打开的情况,这是默认状态。如果AJAX
加载被关闭,jQuery Mobile 将像加载普通页面一样加载页面,并且每个后续页面都将替换 DOM 中的前一页面。
关于您的另一个问题,由于这种架构,相同的 js 文件将永远不会初始化一次以上。但是还有另一个问题,您需要小心事件绑定。由于这种特定的架构事件可以绑定不止一次。因此,您需要使用 pageinit 页面事件来初始化每页的 javascript。这个问题还有更多的解决方案,但我只会在你愿意的时候描述它们。