6

我们有一个移动站点（MVC 风格的 ASP.NET），除其他外，它显示全屏 HTML 幻灯片。

为了显示这一点，我们在 mobileHTMLMovie 视图上运行代码，如下所示：

$( function() {
    $(document).bind('pageinit', function() {
    $("header").hide();
    $(".subHeader").hide();
    $(".subHeaderAccent").hide();
    $("footer").hide();
    $(".ui-content").css("width", "100%").css("height", "100%").css("margin","0").css("background-color", "#000");
    });
});

我们看到的问题是，当用户按下“后退”按钮（他/她仅限于硬件控件，因为此代码禁用了所有包装元素，包括我们的 HTML 移动按钮）时，元素仍然隐藏。

我一直无法找到在他们登陆的页面上运行“反转”代码的方法（显示而不是隐藏，从“.ui-content”中删除样式属性）。他们到达的页面没有运行 document.ready，电影页面没有运行“onunload”或“onbeforeunload”，以及我在网上找到的另一个建议（.live('click') '[data-rel=back]' 元素）也没有工作。

有没有人有什么建议？

4

1 回答 1

1

您可以尝试使用 History 对象并绑定到popstate事件吗？基本上，当幻灯片显示时，你会推入一个新的状态，然后当用户按下时，它可能会触发弹出。

例子：

$(function() {
    $(document).bind('pageinit', function() {
        $("header").hide();
        $(".subHeader").hide();
        $(".subHeaderAccent").hide();
        $("footer").hide();
        $(".ui-content").css("width", "100%").css("height", "100%").css("margin","0").css("background-color", "#000");

        window.history.replaceState("slideshow", "Slideshow", "slideshow");
    });

    window.addEventListener('onpopstate', function(event) {
        if (event.state === "slideshow") {
            //Close the slideshow
        }
    }
});

我不确定页面的流程是什么，但您可以使用replaceState或pushState取决于幻灯片的启动方式

资源

于 2012-12-29T17:28:51.827 回答