2

我有具有这种布局结构的 ASP.NET MVC 3 + JQuery Mobile 应用程序:

<body>
    <div class="page" data-role="page" data-add-back-btn="true" id="page">
        <div data-role="header" data-position="fixed"></div>
        <div data-role="content" id="content">
            @RenderBody()
        </div>
        <div id="footer" data-role="footer" data-position="fixed"></div>
    </div>
</body>

问题是,绑定到窗口的事件处理程序卡住了几个页面。

例如,我有 2 页:"Index""About". 在"Index"我绑定了一些处理程序(比如console.log("index"))事件$(window).click()。但是当我转到"About"页面时 - 这个处理程序仍然处于活动状态。

有没有办法只在适当的页面处于活动状态时才保留处理程序?

4

2 回答 2

1

在 jQM 中使用这种事件绑定:

$('#page').bind('click', function(e) {

});

使用较新版本的 jQuery 使用 .on( 和 .off( 绑定/取消绑定事件。$('#page') 是您的页面。

这:

$(window).click()

将它绑定到窗口,因为 jQM 页面是单个窗口事件,每次都会触发。您还需要担心多个事件绑定,在这里您可以找到有关此问题的更多信息。

于 2012-11-29T08:23:56.600 回答
0

我对这个问题做了一些小研究,但没有找到任何合适的问题。所以我已经用窗口事件为描述的用例实现了解决方案。这令人毛骨悚然,但有效。

在布局中:

1.页面div声明:

<div class="page" data-role="page" data-add-back-btn="true"    id="@Request.RawUrl.GetHashCode()">
    ...
</div>

2.脚本:

<script type="text/javascript">
    var bindEvents = [];
    $(document).bind('pagehide', function (event) {
        var hash = $(event.target).attr('id');
        $(window).unbind('.' + hash);
    });

    $(document).bind('pageshow', function (event) {
        var hash = $(event.target).attr('id');
        bindEvents[hash]();
    });
</script>

在页面中:

1.索引:

<script type="text/javascript">
var hashedIndex = '@Request.RawUrl.GetHashCode()';
if (!bindEvents.hasOwnProperty(hashedIndex)) {
    bindEvents[hashedIndex] = function() {
        $(window).bind('click.' + hashedIndex, function() {
            console.log('index');
        });
    };
};
</script>

2.关于:

<script type="text/javascript">
var hashedAbout = '@Request.RawUrl.GetHashCode()';
if (!bindEvents.hasOwnProperty(hashedAbout)){
    bindEvents[hashedAbout] = function () {
        $(window).bind('click.' + hashedAbout, function() {
            console.log('about');
        });
    };
};
</script>

如果需要,类似于其他页面。

在一般情况下,我同意 Gajotres:最好将事件绑定到一些内部容器以避免此类问题。

于 2012-11-29T12:40:49.493 回答