返回页面无法使用jQuery mobile重新加载jQuery

Question

我刚开始接触jQuery手机。

我有一个网站，我正在建设，我希望在一个单独的HTML文件中的每个页面。

当我第一次访问一个页面时，jQuery会触发并按预期绑定我的事件。但是，当我返回到这个页面时，jQuery没有绑定任何内容。

将页面更改为登录屏幕：

$.mobile.changePage("/screens/login.html");

登录屏幕：

< div data-role="page" id="login" data-add-back-btn="true" data-dom-cache="false">
    <script src="/resources/scripts/login.js"></script>
    < div data-role="header" >
        <h1 class="ui-title" role="heading">&nbsp;</h1>
        <a id="btRegister" data-icon="edit">Register</a>
    </div>
</div>

login.js包含将事件绑定到btRegister元素的jQuery：

$(function () {
   $("#btRegister").click(function () {
       $.mobile.changePage("/screens/login.html");
    });
});

这在第一次就能正常工作。我单击登录按钮，并按预期进入登录页面。

在登录页面上，我有几乎完全相同的东西，将我链接回注册页面。

返回到注册页面时，事件未绑定，并且单击事件不执行任何操作。

我已经尝试了所有的方法，包括reloadPage: true和data-dom-cache="false“没有任何东西能让它工作看起来很糟糕。

如果能有更熟悉jQuery手机的人告诉我哪里出了问题，我将不胜感激。我应该只停留在一个HTML页面上吗？我真的很喜欢让我的应用变得更加模块化的能力，有多个HTML文件。

Answer 1

这是正常工作的。我遇到的主要问题是我的部分页面javascript类上的类结构，以及我使用的名称间隔。

我使用的是静态类，所以第一次可以工作，但每次都需要实例化这个类。

我在我的全局js文件上连接了一个钩子，它调用一个公共函数：

$(document).bind("pageshow", function (event, ui) {
    pageInit();
});

然后，我在所有部分页面脚本上都有一个pageInt()，用于实例化页面对象的一个新实例：

function pageInit() {
    var myRegisterPage = new registerPage();
    myRegisterPage.init();
};

function registerPage() {
}

registerPage.prototype = {

    init: function () {
        $("#btLogin").click(function () {
        $.mobile.changePage("/screens/login.html");
    });
}

}

这是非常有压力的。