如何使用jquery mobile在页面更改时重新加载外部javascript？

Question

我在网站的移动版本中有几个使用谷歌位置服务的页面。我正在使用 changePage Ajax 函数来浏览网站页面。在第一页加载位置服务正常工作，如果我去不同的页面并返回它不会。

当我添加 rel="external" 时，它可以工作，但问题是它会重新加载整个页面，这对于桌面应用程序来说不是什么大问题，但在移动设备上看起来不太好。

我尝试将reloadPage = true 添加到changePage，但没有任何区别

有没有办法只重新加载位置服务而不重新加载整个页面？

例子：

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false" ></script>

$("#btn-loc").click(function () {
        $.mobile.changePage("#btn-loc", { reloadPage: true }, { transition: "slide" });
    });

Answer 1

当您使用reloadPage : true 时，您必须引用外部页面的位置，而不是该伪页面元素的 ID：

$("#btn-loc").click(function () {
    $.mobile.changePage("/btn-loc.html", {
        reloadPage : true,
        transition : "slide"
    });
});

还要注意我是如何传入选项对象的，应该只有一个包含您要在单个对象中设置的所有属性。

reloadPage（布尔值，默认：false）

强制重新加载页面，即使它已经在页面容器的 DOM 中。

• 仅当 changePage() 的 'to' 参数是 URL 时使用。

来源：http://jquerymobile.com/demos/1.1.0-rc.1/docs/api/methods.html

更新

要通过 JS 向 DOM 添加脚本，您可以使用 Google 的分析代码：

<script>
    (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = '/path/to/my-file.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
</script>