在 jQuery Mobile 中完成 ajax 导航时执行 javascript 代码答案

【问题标题】：Execute a javascript code when ajax navigation completes in jQuery Mobile在 jQuery Mobile 中完成 ajax 导航时执行 javascript 代码
【发布时间】：2014-03-23 02:20:01
【问题描述】：

我正在开发一个 jQuery 移动网络应用，目前有两个页面。

首先，页面 1 出现，如果用户点击一个链接，页面 2 将使用 jQuery 移动 ajax 导航系统打开。

但是，有一个问题。第 2 页在加载时应该运行 javascript 代码，但 jQuery 移动 ajax 导航会删除该脚本，即使我将 <script>...</script> 放入 <div data-role="content">...</div>... （如果我在第 1 页的链接中使用 rel="external"，javascript 运行，但如果我想使用 ajax 导航，javascript 不会加载...）

当页面 2 加载 with jQuery Mobile 的 ajax 导航系统时，如何运行该 javascript 代码？

【问题讨论】：

标签： javascript jquery jquery-mobile

【解决方案1】：

在您的第 2 页中，添加以下内容：

$(document).bind("pageshow", 
  function(e) {
    // script here
  }
);

在 jQuery mobile 中，页面默认使用 ajax 加载并缓存。显示第 2 页时，触发“pageshow”事件。

【讨论】：

我应该把这个放在哪里？在<head> 或<div data-role="content"> 中？
如果你将它放在 head 标签中，那么无论该页面是什么，每次显示页面时都会执行它。在您的情况下，您可以将其放在第 2 页的
中。

【解决方案2】：

你可以在你的第一页的头部使用这样的东西：

$( document ).on( "pagecreate", "#PAGEIDHERE", function() {
   //do something here
});

那么脚本只会在页面创建后被调用。或者你可以使用'beforecreate'等。

【讨论】：