0

我正在尝试使用带有 jQ​​uery 的 AJAX 轮询来更新 ASP.NET MVC3 中剃刀 MasterPage 上的 span 元素。该页面使用 jQuery Mobile 1.0 框架,该框架使用某种“过渡”动画来装饰简单的视图更改(例如从 /home 导航到 /about)。

这是执行轮询的 Javascript 代码,而“unreadBubble”跨度位于正文中 - 两者都在 MasterPage 中定义!

<script type="text/javascript">
$(document).bind("pageinit", function poll() {
    setTimeout(function () {
        $.ajax({ url: "/Notification/GetUnreadNotificationsCount", 
                    dataType: "json",
                    success: function (data) {
                    $('#unreadBubble').text(data.UnreadCount);
                    poll();
                } 
            });
    }, 1000);
});

所以,想象一下我有一个 HomeController 和一个 NotificationController,它们都使用 MasterPage 并提供一个 Index 视图。AJAX 轮询适用于两个视图,并按预期每秒更新跨度。但是,一旦我从一个视图导航到另一个视图,跨度就会使用 MasterPage(空)中的默认值重新初始化,并且不再更新。有趣的是,仍然在 NotificationsController 上反复调用异步 GetUnreadNotificationsCount 方法 - 跨度只是不更新​​。我还尝试提醒 JS 中的 span 标签,它不是 null 什么的。

根据文档,jQuery Mobile 还使用 AJAX 加载新页面以插入这个花哨的“SWOOSH”过渡动画。这似乎以某种方式扰乱了 JS/DOM 初始化。

你知道如何解决这个问题吗?我应该绑定到另一个事件还是可以强制更新 span 标签?

解决方案:这是一个缓存问题!下面的诀窍:将class="command-no-cache"添加到您的页面 div 将以下 JavaScript 添加到 MasterPage:

$(":jqmData(role=page)").live('pagehide', function (event, ui) {
if ($(this).children("div[data-role*='content']").is(".command-no-cache"))
    $(this).remove();

});

4

1 回答 1

0

我会使用 pagebeforeshow 来实际绑定事件,并使用 pagehide 来删除事件。

您是否尝试过,而不是在 pageinit 事件中只初始化一次?

更新:例如一些代码,

 <script type="text/javascript">
 var timer = null;
 $(":jqmData(role=page)").bind("pagebeforeshow", function() {
     timer = setTimeout(function() {
               $.ajax({ url: "/Notification/GetUnreadNotificationsCount", 
                  dataType: "json",
                  success: function (data) {
                     $('#unreadBubble').text(data.UnreadCount);
                  } 
               });
             }, 1000);
 }); 
 $(":jqmData(role=page)").bind("pagehide", function() {
     if (timer != null){
          clearTimeout(timer);
          timer = null;
     }
 });
</script>

在此过程中还更正了一些其他“错误类型”,请查看并与您的代码进行比较!

希望这可以帮助

于 2011-12-02T11:59:52.133 回答